表达式和运算符
表达式:表达式用于JavaScript脚本运行时进行计算的式子,可以包含常量、变量、运算符
运算符:操作数据值的操作符
算术运算符:+、-、*、/、%
一元运算符:++、--
......
算符运算符
1.+
1.如果两个操作符都是数值,执行常规的加法计算
2.如果有一个操作数是字符串,规则如下:
1.如果两个操作数都是字符串,将两个操作数拼接
2.如果只有一个操作数是字符串,则将另一个数转换成字符串,再将两个字符串拼接起来
3.如果有一个操作数是对象、数值、Boolean,则需要调用他们的toString()方法取得相应的字符串值
注意:
Undefined /null调用string()方法将其转换成“Undefined”、“null”
2.-
1.如果两个操作数都是数值,进行常规的减法,并返回结果
2.如果有一个操作数是字符串、Boolean、null/Undefined则需要调用number()函数将其转换成数值,根据前面的规则进行减法
注意:
如果转换的结构是NaN,减法的结果就是NaN
3.如果操作数是一个对象,则调用对象的valueOf()方法取得表示该对象的数值
1.如果值为NaN,减法的结果解释NaN
2.如果对象没有valueOf()这个方法,则调用toString()方法将得到的字符串转成数值,在进行常规计算
3.*
基本:
1.如果操作数都是数值,进行常规计算
1.1 如果两个都是正数,结果是正数
1.2 如果只有一个有操作符号,那么结果为负数
1.3 如果乘积成果了ECMAScript数值的表示范围,返回Infinity或者-Infinity
特殊的规则:
1.如果操作数为NaN,结果为NaN
2.如果是Infinity和0相乘,结果为NaN
3.如果Infinity与非0数值相乘,结果为Infinity或负Infinity,取决于有符号操作数的符号
4.如果Infinity和Infinity相乘,结果为Infinity
5.如果操作数不是一个数值,则需要调用number()方法将其转换成数值,在进行上面的规则
4./
特殊:
1.如果零被零除,结果为NaN
2.如果有一个非零的有限数被零除,结果为Infinity和-Infinity,取决于有符号操作符的符号
5.%
var result=26%5;//1
1.如果操作数都是数值,执行常规除法计算,返回除得的余数
2.如果被除数是无穷大而除数是有限大的数值,结果为NaN
3.如果被除数是有限大的数值而除数为0,结果为NaN
4.如果Infinity被Infinity除,结果为NaN
5.如果被除数是有限大的数值而除数是无穷大的数值,结果为被除数
6.如果被除数为0,结果为0;
7.如果有一个操作数不是数值,在后台调用Number()方法,将其转换成数值,在进行上面的运算
一元运算符
1.只能操作一个值的操作符叫做一元运算符
2.自增++
自减--
在赋值操作时,
1.1 如果递增或递减运算符前置,那么前置的运算符会先累加或累减在赋值
1.2 如果递增或递减运算符后置,那么后置运算符则先赋值在累加或累减
如:
var box=100;
var age=++box; 101
var height=box++; 100
3.其他类型应用一元运算的规则
var box='89'; box++ 数值字符串自动转换成数值 //90
var box='ab'; box++ 字符串包含非数值转成NaN 、//NaN
var box=false; box++ false转成0, 1
var box=2.3; box++ 直接加1, 3.3
例如:
var a=9;
var b=++a;
a=a+1;
alert(a+" "+b)
赋值运算
1.定义:将右边的值赋给左边的变量
2.复合操作;+=、-=、*=、/=、%=
如:
var num=10;
num=num+10 等价于num+=10;
比较运算符
1.比较运算符的结果Boolean类型(>、>=、<、<=)
2.当关系操作符的操作数使用了非数值,需要进行数据转换,完成相对应的功能
1.1 如果两个数都是数值,则执行数值比较
1.2 如果两边都是字符串,比较的是字符串对应的字符编码值
1.3.如果一个操作数是数值,则将另一个操作符转换成数值,进行比较
1.4 如果一个操作数是对象,则需要调用对象的valueOf()方法,如果没有则调用toString(),将得到的结果根据前面的规则进行比较
1.5 如果一个操作数为Boolean类型,需要将其转换成数值,在进行比较
等于==规则
1.如果两个类型相同,进行==比较
2.如果操作数为非数值,需要遵循以下规则:
1.1 一个操作数为Boolean,比较前需要将其转换为数值类型 false:0 true:1
1.2 一个操作符为字符串,先转成数值类型在比较
1.3 一个操作符为对象,则现代用valueOf()、toString(),将返回值进行比较
1.4 在不需要任何转换的情况下,null / Undefined 是相等的,
注意:这两个值在进行比较时,不能进行类型转换
1.5 一个操作数为NaN,则==返回false != 返回true 和自身不等
恒等于===的规则
1.如果类型不相同,就不相等
2.如果两个都是数值,并且是同一个值,那么相等
注意:
2.1 如果其中至少一个NaN,那么就不相等,判断一个值是否是NaN,用isNaN()方法
3.如果两边都是字符串,每个位置的字符都相等,那么相等,反之不相等
4.如两边的值为true 或 false 则相等
5.如果两边的值都引用同一个对象或函数,那么相等
6.如果两边的值为null或者undefined 那么相等
其他的运算符
typeOf运算符
typeOf运算符用来返回一个字符串,返回的是操作数的数据类型
对一个值使用typeOf 操作符可能返回字符串
1.“Undefined” 该值没有定义
2.“Boolean” 该值是Boolean值
3.“string” 该值是字符串
4.“number” 该值是数值
5.“Object” 该值是一个对象或者null
6.”function“ 该值是一个函数
逻辑运算符
逻辑非!
逻辑非操作符遵循以下规则:
1.如果操作数是一个对象 ,返回false
2.空字符串 true 反之为false
3.数值为0,返回 true
4.任何非0(包括Infinity) 返回false
5.null 返回true
6.NaN true
7.undefined true
逻辑与&和&&(短路)
第一个操作数 第二个操作数 结果
true true true
false true false
true false false
false false false
2.逻辑与操作可以应用于任何类型的操作数,而不仅仅是Boolean,在一个操作数不是Boolean类型的情况,逻辑与就不一定返回Boolean
遵循以下规则:
1.如果第一个操作数为对象,则返回第二个操作数
2.如果第二个操作数是对象,则只有第一个操作数的求值结果为true的情况下才会返回该对象
3.如果两个操作数都是对象,则返回第二个操作数
4.有一个操作数为null,返回null
5.如果有一个操作数为NaN,返回NaN
6.如果有一个操作数为Undefined则返回Undefined
逻辑或|和||(短路)
第一个操作数 第二个操作数 结果
true true true
false true true
true false true
false false false
特殊规则:
1.如果第一个操作数为对象,则返回第一个操作数
2.如果第一个操作数的求值结果为false,则返回第二个操作数
3.如果两个操作数都是对象,则返回第一个操作数
4.有两个操作数为null,返回null
5.如果有两个操作数为NaN,返回NaN
6.如果有两个操作数为Undefined则返回Undefined
三目运算符
称之为条件运算符是ECMAScript中功能最多的运算符
他的形式和Java中一样
variable=boolean_ex?true:false;
例如:
var iMax=(iNUm1>iNUm2)?iNUm1:iNum2;
条件语句
1.语句
2.条件语句
3.if语句
4.switch语句
语句
定义:
ECMA规定一组语句(流程控制语句)
语句定义了ECMAScript中主要的语法
条件语句:
1.if语句
2.switch语句
循环语句:
1.while循环语句
2.do...while语句
3.for循环语句
条件语句
概念:
通过制定判断的表达式的值来决定执行还是跳过某些语句
这些语句是代码的决策点,称之为“分支”
第一种格式:
if(条件){
//代码块
}
当代码块只有一条语句时,可以省略大括号
这其中的条件可以是任何的表达式,计算的结果不必是Boolean,ECMAScript,会将其转换成Boolean值
第二种:
if(条件){
//代码块1
}else{
//代码块2
}
第三种:
多重if语句
if(条件){
//代码块1
}else if(条件){
//代码块
}
else{
//代码块2
}
第四种:
嵌套if
if(条件){
if(条件){
//代码块
}
}
switch语句
switch语句的语法:
switch ()
case value: statement;
break;
case value: statement;
break;
default :statement
特点:
1.可以在switch语句中使用任何类型的数据
每一个case的值不一定是常量,可以是变量,表达式
2.每个case按照顺序被求值,直到找到匹配的值或者遇到default语句为止
3.在比较时会使用全等操作符,因此不会发生类型转换(字符串“10”和数值10 不相等)
4,default可以省略
5.break可以省略,穿透
共同点:在一定程度上可以通用
if和switch区别:
1.if一般用于区间、逻辑判断
switch多用于等值比较
2.if使用时嵌套尽量少用,
循环语句
1.循环语句
2.特殊流程控制语句
3.二重循环语句
4.label语句
循环的四个部分:
1.循环变量初始化
2.循环判断条件
3.循环体
4.迭代部分(循环变量增加或减少的处理)
while循环语句
格式:
循环变量的初始化:
while(询函条件){
循环操作;
迭代语句;
}
do..while循环
格式:
循环变量的初始化;
do{
循环操作;
迭代语句;
}while(循环条件);
do...while和while的区别:
1.do....while至少执行一次
2.do...while(表达式)的后面一定要有一个分号,用来表示语句的结束
for循环
格式:
for(var box=1;box<=5;box++){
alert(box);
}
循环顺序:
1.声明变量var box=1;
2.判断条件
3.执行语句体
4.判断循环条件
加强for
格式:
for(vriable in object){
statement
}
说明:
vriable:通常是一个变量名或表达式或者是var 声明的变量
object:表达式,计算结果是一个对象
通常用枚举对象的属性
特殊流程控制语句
1.break:
2.continue
label语句
语法:
标签名:for(表达式1;表达式2;表达式3){
break 标签名;
或者continue 标签名
}
例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript">
for(var i=0;i<5;i++){
bk:
for(var j=0;j<5;j++){
if(i==1&&j==1){
break bk;
}
document.write(i+" "+j+"<br/>")
}
}
</script>
</body>
</html>
总结:
for循环、while循环、do...while循环、for-in
1.可以相互转换
2.可以相互嵌套
3.特殊流程控制语句,可以在其使用
4.循环中可以嵌套分支语句,分支语句也可以嵌套循环
函数
函数的概念和作用
1.概念:函数就是把完成特定功能的一段代码封装起来,给该功能起一个名(函数名)
注意:函数可以在任何地方调用
2.作用:
1.使程序变得更简洁和清晰
2.便于维护
3.可以提高程序的开发效率
4.提高了代码的重用性
说明:
不使用函数,JavaScript代码必须执行,且执行的时间,执行的部分不可控,使用函数后浏览器不会直接去执行它,只有在调用该函数时才会被浏览器执行
函数的分类
1.官方定义函数:
alert();
parseInt();
parseFolat();
isNaN();
2.自定义函数:
用户根据自己的需求定义的函数
函数的命名规范
1.函数名不能包含特殊字符
2.函数名最好含义明确
3.函数名称最好遵循驼峰标记法或者下划线法
4.函数名严格区分大小写
5.函数名如果产生重复会覆盖
函数的定义
格式:
1.无参数:
function 函数,名(){
js代码;
}
2.有参数
function 函数名(形式参数列表){
js代码;
}
3.匿名函数
function(){
js代码;
}
4.有返回值的函数
function 函数名(形式参数列表){
js代码;
return 返回值;
}
总结:
1.函数需要使用function关键字,必须写
2.函数名---标识符,
3.参数列表只有变量名,没有var关键字
无参函数
只有一个参数
有多个参数
4。{函数体}:
1.有返回值的函数
2.没有返回值的函数
函数的实参和形参
1.实参和形参:
形参---就是函数在定义时,函数名后面的参数,不能使用var关键字
实参---就是调用时,函数名后面的参数
2.传参---赋值:将实参的值赋给形参
3.JavaScript语言的特殊之处:
1.不检查实参的类型,不检查形参的个数
JavaScript语言与大多数语言在函数参数上是不一样
JavaScript语言不在乎你传入参数的个数和类型
在JavaScript每个函数的函数体重都有一个arguments对象来访问这个函数的参数,从而获取所有传过的参数
4.JavaScript语言可以传入任意多个参数
函数参数的类型
1.值类型的数据作为参数传递的时候,相当于操作值的副本
2.引用传递操作的是参数本身
例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript">
var a=3,b=5;
var c=a; //a:3 b;5 c:3
a=b; // a=5
b=c; //b:3
//实现两个变量值交换的方法
//a,b就是形式参数,代表两个数据
function change(arr){
var c=arr[0];
arr[0]=arr[1];
arr[1]=c;
}
var people=new Object();//people 是对象 引用类型
people.name=“李四”;
change(people);
</script>
</body>
</html>
函数的返回值
函数的返回值可以返回:
number string boolean null undefined object
注意:
当函数没有返回值时,其实返回值为undefined
例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript">
/*var flag=confirm("确定删除吗?");
alert(flag);
var a=alert("dgshj")
*/
/* function test(a,b){
var result=a-b;
return result;//注意return 只能在函数中使用,代码执行到return就结束这个函数
}
var num=test(3,5);
alert(num);*/
//求三个数的最大值
function getMax(a,b,c) {
//用return把参数不是数值的情况给排除,并返回提示信息
if (typeof(a) != "number" || typeof(b) != "number" || typeof(c) != "number")
{
return "参数必须都是数字";
}
var max=-Infinity;
var min=Infinity;
if(a>max){
max=a;
}
if(b>max){
max=b;
}
if(c>max){
max=c;
}
if(a<min){
min=a;
}
if(b<min){
min=b;
}
if(c<min){
min=c;
}
return "最大值:"+max+",最小值:"+min;
}
alert(getMax(21,40,-4));
</script>
</body>
</html>
函数的调用
1、函数名(参数)调用
1.1 通过函数名()进行调用,如果有参数产地相对应的参数即可
1.2 在HTML中默认的全局对象是HTML页面本身,所以函数是属于HTML页面,在浏览器中的页面对象是浏览器窗口(window对象)
2.事件驱动:
所有的函数没有调用不会执行,那么函数调用的源头就是事件,之前学过点击事件onclick
成为焦点onfocus 失去焦点 onblur
3.如:window.函数(参数):
注意:
1.在函数体内可以调用另外一个函数
2.函数可以自己调自己(递归)
全局对象:
1.当函数没有被自身对象调用时,this的值就变成全局对象
在web浏览器中全局对象是窗口对象(window对象)
2.函数作为全局对象的调用,会使this,window对象成为全局对象,会使程序容易崩溃
注意对象:
1.函数可以有一个或多个参数,也可以没有
2.函数可以通过return加返回值,如果没有return,默认返回undefined
3.函数不调用不执行
4.JavaScript对大小写敏感,关键字function 必须小写
,并且必须与函数名相同的大小写来调整函数
变量的作用域
定义:变量起作用的范围,变量的有效范围
局部变量:在函数内部的变量,形参也是局部变量
全局变量:在函数外部的变量,作用域范围是当前文件的任何地方
说明:
1.JavaScript的变量的作用域是根据方法块来划分的,也就是function的大括号来划分的
注意:function块是划分标准,而for/while并不是作用域的划分标准
2.JavaScript在执行前会对整个脚本文件的声明部分做完整的分析(包括局部变量),从而确定实变量的作用域
3.当全局变量跟局部变量重名时,局部变量的作用域会覆盖全局变量的作用域
4.全局变量位于全局区,局部变量位于栈区
匿名函数
定义函数的两种格式:
1.function 函数名(){
//函数体
}
2.匿名函数
var fun=function()
{
//函数体
}
匿名函数的用处:
1.函数表达式可以储存在变量中,变量可以作为一个函数使用,也可以将匿名函数作为参数传递给其他函数,
如果需要完成一次性的任务,可以用匿名函数
函数的重载
定义:
重载函数时函数的一种特殊情况
:允许在同一个范围内声明几个功能类似的同名函数,但是这些同名函数的形式参数(指参数的个数或类型或顺序)必须不同,也可以说同一个运算符完成不同的运算功能,称之为重载函数
1.函数有不同的参数
2.函数有不同的参数类型
但是在JavaScript语言中,如果函数名一样会出现覆盖的情况,无法实现函数的重载
JavaScript并没有重载函数的功能,但是arguments对象可以模拟重载
JavaScript中每个函数都会有一个arguments对象实例arguments,他引用着函数的实参,可以用数组的下标方式“[]”引用arguments的元素
arguments.length为函数实参的个数
arguments.callee引用函数自身
arguments
定义:
arguments对象不能显示创建,只有函数开始时才可用
函数的arguments对象并不是一个数组,访问单个参数的方式与访问数组元素的方式相同
索引n实际就是arguments对象的0~n属性的其中一个参数。
注意:
1.arguments的length属性返回调用程序传递给函数的实际参数数目
2.arguments的0~n属性返回一个arguments对象中的各个参数的实际值,相应的值由一个正在执行的函数的arguments属性返回
递归
定义:在函数体内调用本函数
递归的满足条件:
1.函数自己调用自己
2.要有出口
3.尽量层层递进
注意:
处理不当就如死循环,递归函数只有在特点的情况下使用
数组
1.数组定义:
值的有序集合,美誉个值都叫做一个元素,每一个元素在数组中都有一个位置,以数字表示,叫索引
特点:
1.JavaScript数组是无类型的,数组的元素可以是任意类型,并且同一个数组中的元素可以是不同类型,
2.ECMAScript语言中数组的长度是可以动态变化的,可以添加和删除元素
3.Array数组是数据的有序列表,索引从0开始
4.ECMAScript同一个数组可以存储不同类型的数据,也可以没有类型,但每一个数组都有length属性
数组的创建
1.数组字面量方式:
//创建3个字符串的数组
var aColor=["red","yellow","blue"];
//创建空数组
var aColor=[];
var aColor=[1,2,3,];
bug:
在IE8以及之前显示的个数为4个
IE9,ff,chrome,opera中显示是3个,不要用这种方式去创建数组
注意:
省略数组中的某个值,默认值为undefined
2.构造函数方式:
//创建一个空函数
var aColor=new Array();
//创建一个容量为20 的数组
var aColor=new Array(20);
//创建一个包含3个字符串元素的数组
var aColor=new Array("red","yellow","blue");
注意:
1.最后一个元素不可以加逗号,会报语法错误
2.使用构造函数法创建数组时,如果只传一个值,这个值是number类型,那么必须是大于等于0的整数,否则语法报错
3.使用构造函数创建数组时,可以省略new关键字(不建议)
数组的长度
length属性:表示数组的长度
不同:
JavaScript数组的length属性是可变的,
1.当length被设置的更大时,整个数组的状态事实上不会发生变化,仅仅是length属性值变大
2.当length属性被设置的比原来更小时,则原先数组中国索引大于或等于length元素的值会全部丢失
3.length属性不仅可以被显示设置,他也可以被隐式修改
注意:
1.数组的length属性不是只读的,可以通过数组的length属性向数组的末尾扩大数组的容量,或者可以从数组的末尾移除其他元素
数组的遍历
定义:获取数组中的每一个元素
1.for循环
for(var i=0;i<arr.length;i++){
//代码块
}
2.加强for循环
for (var i in arr){
//代码块
}
3.forEach:是对数组中每一个元素进行函数体的操作
是ECMAScript5.0新特性
注意:forEach不支持break/continue语句
在低版本的IE中也无法使用
数组中的常用方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<script type="text/javascript">
var arr=["21sd",23,6,0,-2];
var str=arr.join("///");
//1.join(连接符字符串),无参的时候默认使用“,”链接,返回值时连接后的字符串,操作对数据并没有影响
//alert(typeof str+" "+str);
//alert(arr);
var arr2=str.split("///");
var s="abc13";
// 2. arr2=s.split("");
//alert(arr2);
//要在页面输入一个用户名,判断这个用户名是否全部由字母组成
//数组元素倒置,返回倒置之后的结果,该倒置度数组本身有影响reverse()
// alert(arr.reverse());
//alert(arr);
//3.sort() 返回排序之后的结果,对齐数组本身有影响
// 3.1 sort()无参,按照字符的先后顺序排序
// 3.2 sort()有参 参数必须是一个函数
//var arr2=[11,22,3,4,56,-54353,555]
//arr2.sort(test)
//alert(arr2);
// function test(a,b) {
// return a-b;
// }
//4.concat();参数可以是任意类型,表示吧参数都链接到原数组上,返回新的数组,该链接对原数组并没有影响、
//参数是一个数组时,则将数组中的元素链接到原始数组上
//alert(arr.concat(111,"哈哈哈"));
//var newArr=arr.concat([false,true]);
//alert(newArr[5]);
/*5.slice():
1.slice():返回值是截取数组的一部分,截取对原数组无影响
2.slice():只有一个参数的时候是起始下标,表示当前的位置一致截取到最末尾
3.slice():如果有两个参数,第二个参数表示终止下标,截取时会包含起始下标上的字符,不包含终止下标上的字符
注意:
如果下标为负值,责先讲该负值+length获取一个正值,在截取*/
//alert(arr.slice(2,2))
//alert(arr.slice(1,3));
/* 6.splice():返回值为删除掉的元素组成的新数组,删除会对原数组产生影响,数组的长度也会收到影响
splice():第一个参数表示起始下标,负值责+length在作为起始下标
第二个参数表示要删除元素的个数,如使负值等同于0;
之后的参数表示要插入的数据,如果该方法只有一个参数,表示从起始下标一直删除到末尾
*/
// alert(arr.splice(-2,2,false,true,"ddd"));
/*var arr3=[1,3,2,5,2,65,1,2,3,3,3,3];
for(var i=0;i<arr3.length;i++)
{
for(var j=i+1;j<arr3.length;j++){
if(arr3[j]==arr3[i]){
arr3.splice(j,1);
}
}
}
alert(arr3);*/
/*7.push():项数组的末尾追加元素,返回追加元素后数组的长度,
参数可以是一个或多个,表示要追加的数据,追加对原数组产生影响*/
//alert(arr.push(false,true));
//alert(arr);
// 8.pop():表示从数组的末尾往外弹出数据
//alert(arr.pop());
//9.map();
// var arr=[1,2,3,5,7];
// var newArr=arr.map(function (x,index,ar) {
// return x%2;
// })
//10.filter():
//11.reduce
//12.some();
/* 13.indexOF():在一个数组中查找子元素,若存在,返回该元素的下标,若不存在则返回-1;
注意:
indexOF():从左到右查找,并且只查找一次*/
var arr=[1,4,"dsdf",true,"呵呵呵",-234,3];
//alert(arr.indexOf(5));
// 13.lastIndexOf():从末尾开始查找
var result=arr.lastIndexOf(3);
alert(result);
14.unshift();向数组的头部插入一个或多个元素,
参数:需要插入的值
返回值:新数组的长度,会改变原来数组的长度
</script>
</body>
</html>
数组排序
冒泡排序
1.比较相邻的元素,如果第一个比第二个大,就交换他们两个
2.对每一个相邻元素做同样的工作,从开始的第一对到结束的最后一对
选择排序:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<script type="text/javascript">
var arr=[2,5,0,-1,6];
for(var i=0;i<arr.length-1;i++)
{
for(var j=0;j<arr.length-1;j++){
if(arr[j]>arr[j+1]){
var temp=arr[j];
arr[j]=arr[j+1];
arr[j+1]=temp;
}
}
}
for(var i=0;i<arr.length;i++){
var max=arr[i];
var index=i;
for(var j=i+1;j<arr.length;j++){
if(arr[j]<max){
max=arr[j];
index=j
}
}
}
function text(a,b) {
if(a>b){
return -1;
}else if(a<b){
return 1;
}else {
return 0;
}
}
arr.sort(text);
alert(arr);
</script>
</body>
</html>