JavaScript 艺术之美(三)条件语句和循环语句

JavaScript使用条件语句来做判断,在脚本中用条件语句来设置一个条件,满足这一条件的语句将得到执行;循环语句可以让我们反复多次地执行同一段代码,只要给定条件仍能得到满足,包含在循环语句里的代码将重复地执行下去。

一、条件语句

在 JavaScript 中,可使用以下条件语句:
- if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码
- if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码
- if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
- switch 语句 - 使用该语句来选择多个代码块之一来执行

1. if 语句

if 语句基本语法:

if (条件) {
  只有当条件为 true 时执行的代码
  }

条件必须放在 if 后面的圆括号中,条件求值结果永远是一个布尔值,花括号中的语句只有在给定条件的求值结果是ture时才会执行:

if (1<2) {
    alert("hello world!");
}

使用花括号可提高脚本的可读性,花括号里只包含一条语句时可省略花括号,而这条if语句中全部内容可以写在同一行上:

if (1<2) alert("hello world!");

If...else 语句语法,包含在else中的语句会在给定条件为假时执行:

if (1>2) {
    alert("hello world!");
} else {
    alert("the false!");
}

使用 if....else if...else 语句来选择多个代码块之一来执行:

if (条件 1) {
  当条件 1 为 true 时执行的代码
  }
else if (条件 2) {
  当条件 2 为 true 时执行的代码
  }
else {
  当条件 1 和 条件 2 都不为 true 时执行的代码
  }

2. switch 语句

switch 语句的语法,引用来自 http://www.w3school.com.cn/js/pro_js_statements_switch.asp

switch (expression)
  case value: statement;
    break;
  case value: statement;
    break;
  case value: statement;
    break;
  case value: statement;
    break;
...
  case value: statement;
    break;
  default: statement;

每个情况(case)都是表示“如果 expression 等于 value,就执行 statement”。

关键字 break 会使代码跳出 switch 语句。如果没有关键字 break,代码执行就会继续进入下一个 case。

关键字 default 说明了表达式的结果不等于任何一种情况时的操作(事实上,它相对于 else 从句)。

switch 语句主要是为避免让开发者编写下面的代码:

if (i == 20)
  alert("20");
else if (i == 30)
  alert("30");
else if (i == 40)
  alert("40");
else
  alert("other");

等价的 switch 语句是这样的:

switch (i) {
  case 20: alert("20");
    break;
  case 30: alert("30");
    break;
  case 40: alert("40");
    break;
  default: alert("other");
}

二、循环语句

JavaScript 支持不同类型的循环:
- while - 当指定的条件为 true 时循环指定的代码块
- do/while - 同样当指定的条件为 true 时循环指定的代码块
- for - 循环代码块一定的次数
- for/in - 循环遍历对象的属性

1.while 循环

While 循环与if语句相似,条件放在while后面括号里,会在指定条件为真时循环执行花括号里的代码块:

变量初始值;
while (条件) {
    执行的代码块;
    变量变化语句;
}

示例代码:

var count = 1;
while (count<11) {
    alert(count);
    count++;
}

如果忘记增加条件中所用变量的值,该循环永远不会结束。可能导致浏览器崩溃。

2.do...while 循环

类似if语句,如果while循环条件首次求值结果为false,花括号里的语句就永远不被执行,因为对循环控制条件的求值发生在每次循环开始之前,do循环会在检查条件是否为真之前执行一次代码块,如果条件为真的话,就会重复这个循环。

变量初始值;
do {
    执行的代码块;
    变量变化语句;
  }
while (条件);
// 以下代码alert将闪现10次,循环结束后变量count值为11。
var count=1;
do {
    alert(count);
    count++;
}
while(count<11);
// 以下代码alert将闪现1次,循环结束后变量count值为2,尽管循环控制条件的求值结果为false。
var count=1;
do {
    alert(count);
    count++;
}
while(count<1);

3.for 循环

for (语句 1; 语句 2; 语句 3) {
  被执行的代码块;
  }

语句 1 在循环(代码块)开始前执行
语句 2 定义运行循环(代码块)的条件
语句 3 在循环(代码块)已被执行之后执行
注意 * 语句间用分号分开而不用逗号
以下代码将被重复执行10次:

for(var count=1;count<11;count++) {
    alert(count);
}

for 循环遍历数组:

var beatles = Array("John","Paul","George","Ringo");
for (var count = 0; count < beatles.length; count++) {
    alert (beatles[count]);
}

array.length 属性可以告诉我们给定数组里的元素个数,数组下标从0而不是1开始。

4.For/In 循环

JavaScript for/in 语句循环遍历对象的属性:

var person={fname:"John",lname:"Doe",age:25};
var x;
for (x in person)
  {
  alert(person[x]);
  }

运行以上代码结果依次闪现:John、Doe、25