牛骨文教育服务平台(让学习变的简单)

第六章流程控制语句

讲师:无脑码农(张磊)
博客:http://www.h5code.com

课程内容:


>ECMA-262 规定了一组流程控制语句。语句定义了ECMAScript 中的主要语法,语句通
常由一个或者多个关键字来完成给定的任务。诸如:判断、循环、退出等。

1.>语句的定义

>在ECMAScript 中,所有的代码都是由语句来构成的。语句表明执行过程中的流程、限定与约定,形式上可以是单行语句,或者由一对大括号“{}”括起来的复合语句,在语法描述中,复合语句整体可以作为一个单行语句处理。

语句的种类

类型子类型语法
声明语句 变量声明语句 var box = 100;
声明语句 标签声明语句 label : box;
表达式语句 变量赋值语句 box = 100;
表达式语句 函数调用语句 box();
表达式语句 属性赋值语句 box.property = 100;
表达式语句 方法调用语句 box.method();
分支语句 条件分支语句 if () {} else {}
分支语句 多重分支语句 switch () { case n : ...};
循环语句 for for (;;;) {}
循环语句 for ... in for ( x in x) {}
循环语句 while while () {};
循环语句 do ... while do {} while ();
控制结构 继续执行子句 continue ;
控制结构 终端执行子句 break ;
控制结构 函数返回子句 return ;
控制结构 异常触发子句 throw ;
控制结构 异常捕获与处理 try {} catch () {} finally {}
其他 空语句 ;
其他 with 语句with () {}

2.>if 语句

>if 语句即条件判断语句,一共有三种格式:

1 . if (条件表达式) 语句;

var box = 100;
if (box > 50) alert("box大于50");//一行的if语句,判断后执行一条语句
var box = 100;
if (box > 50)
alert("box 大于50"); //两行的if 语句,判断后也执行一条语句
alert("不管怎样,我都能被执行到!");
var box = 100;
if (box < 50) {
alert("box 大于50");
alert("不管怎样,我都能被执行到!");//用复合语句包含,判断后执行一条复合语句
}

>对于if 语句括号里的表达式,ECMAScript会自动调用Boolean()转型函数将这个表达式的结果转换成一个布尔值。如果值为true,执行后面的一条语句,否则不执行。

PS:if 语句括号里的表达式如果为true,只会执行后面一条语句,如果有多条语句,那么就必须使用复合语句把多条语句包含在内。

PS2:推荐使用第一种或者第三种格式,一行的if语句,或者多行的if 复合语句。这样就不会因为多条语句而造成混乱。

PS3:复合语句我们一般喜欢称作为:代码块。

2 . if (条件表达式) {语句;} else {语句;}

var box = 100;
if (box > 50) {
alert("box 大于50"); //条件为true,执行这个代码块
} else {
alert("box 小于50"); //条件为false,执行这个代码块
}

3 .if (条件表达式) {语句;} else if (条件表达式) {语句;} ... else {语句;}

var box = 100;
if (box >= 100) { //如果满足条件,不会执行下面任何分支
alert("甲");
} else if (box >= 90) {
alert("乙");
} else if (box >= 80) {
alert("丙");
} else if (box >= 70) {
alert("丁");
} else if (box >= 60) {
alert("及格");
} else { //如果以上都不满足,则输出不及格
alert("不及格");
}

3.>switch 语句

>switch 语句是多重条件判断,用于多个值相等的比较。

var box = 1;
switch (box) { //用于判断box 相等的多个值
case 1 :
alert("one");
break; //break;用于防止语句的穿透
case 2 :
alert("two");
break;
case 3 :
alert("three");
break;
default : //相当于if 语句里的else,否则的意思
alert("error");
}

4.>do...while 语句

>do...while 语句是一种先运行,后判断的循环语句。也就是说,不管条件是否满足,至少先运行一次循环体。

var box = 1; //如果是1,执行五次,如果是10,执行1 次
do {
alert(box);
box++;
} while (box <= 5); //先运行一次,再判断

5.>while 语句

>while 语句是一种先判断,后运行的循环语句。也就是说,必须满足条件了之后,方可运行循环体。

var box = 1; //如果是1,执行五次,如果是10,不执行
while (box <= 5) { //先判断,再执行
alert(box);
box++;
}

6.>for 语句

>for 语句也是一种先判断,后运行的循环语句。但它具有在执行循环之前初始变量和定义循环后要执行代码的能力。

for (var box = 1; box <= 5 ; box++) { //第一步,声明变量var box = 1;
alert(box);     //第二步,判断box <=5
}               //第三步,alert(box)
                //第四步,box++
                //第五步,从第二步再来,直到判断为false

7.>for...in 语句

>for...in 语句是一种精准的迭代语句,可以用来枚举对象的属性。

var box = { //创建一个对象
"name" : "无脑码农", //键值对,左边是属性名,右边是值
"age" : 28,
"height" : 178
};
for (var p in box) { //列举出对象的所有属性
alert(p);
}

8.>break 和continue 语句

>break 和continue语句用于在循环中精确地控制代码的执行。其中,break 语句会立即退出循环,强制继续执行循环体后面的语句。而continue 语句退出当前循环,继续后面的循环。

for (var box = 1; box <= 10; box++) {
if (box == 5) break; //如果box 是5,就退出循环
document.write(box);
document.write("<br />");
}

for (var box = 1; box <= 10; box++) {
if (box == 5) continue; //如果box 是5,就退出当前循环
document.write(box);
document.write("<br />");
}

9.>with 语句

>with 语句的作用是将代码的作用域设置到一个特定的对象中。

var box = { //创建一个对象
"name" : "无脑码农", //键值对
"age" : 28,
"height" : 178
};
var n = box.name; //从对象里取值赋给变量
var a = box.age;
var h = box.height;

>可以将上面的三段赋值操作改写成:

with (box) { //省略了box 对象名
var n = name;
var a = age;
var h = height;
}