JavaScript语句概述

  • 1 if语句
  • 2 if...else语句
  • 3 if...else if语句
  • 4 switch语句
  • 5 条件表达式构成的选择结构
  • 6 while循环
  • 7 do...while循环
  • 8 for循环
  • 9 for...in循环
  • 10 for...of循环
  • 11 continue关键字
  • 12 break关键字
  • 13 with语句


1 if语句

if语句也称为条件语句、单分支语句，它表示当满足某种条件时，就进行某种处理，使用格式如下：

if (condition) {
	statement1;
}

这里的condition可以是任何表达式，并且求值结果不一定是布尔值，该值会自动调用Boolean()函数转化为布尔值。

在没有“{}”的时，if语句的控制范围是到其后的第一条语句，如下所示：

if (condition) statement1;

智JavaScript 中的基本流程控制语句有_javascript

2 if…else语句

if…else语句也称为双分支语句，当满足某种条件时，就进行某种处理，否则进行另一种处理。语法为：

if (condition) {
    statement1;
} else {
    statement2;
}

注意：else是关键字，不能单独使用，必须和if结合使用

智JavaScript 中的基本流程控制语句有_if语句_02


例如：

if (i > 25) 
	console.log("Greater than 25."); // 只有一行代码的语句
else { 
	console.log("Less than or equal to 25."); // 一个语句块
}

3 if…else if语句

if…else if语句也称为多分支语句，可针对不同情况进行不同的处理。语法为：

if (条件表达式1) {
    // 代码段1 
}
else if (条件表达式2) {
    // 代码段2 
}
else if (条件表达式n) {
    // 代码段n 
}
...
else {
    // 代码段n+1  
}

例如：

if (i > 25) { 
	console.log("Greater than 25."); 
} else if (i < 0) { 
	console.log("Less than 0."); 
} else { 
	console.log("Between 0 and 25, inclusive."); 
}

4 switch语句

switch语句也是多分支语句，功能与if…else if语句类似，不同的是它只能针对某个表达式的值作出判断，从而决定执行哪一段代码。语法为：

switch (表达式) {
    case 值1
       // 代码段1;
       break;
    case 值2
       // 代码段2;
       break;
       ...
    default:
        代码段n;
}

说明：

  • “表达式”：运算结果的类型不能是浮点型
  • “常量”（值1、值2…）类型必须和“表达式”的运算结果的类型一致
  • break：跳出switch结构
  • default：是关键字，表示所有case情况之外的，可以有也可以没有；位置是任意的，通常放在所有case之后

5 条件表达式构成的选择结构

条件运算符是一个三目运算符，格式为：

表达式1 ? 表达式2 : 表达式3

先运算“表达式1”，若结果为true，选择“表达式2”进行运算，并把“表达式2”的运算结果作为整个条件表达式的值；若“表达式1”的运算结果为false，选择“表达式3”进行运算，并把“表达式3”的运算结果作为整个条件表达式的值

6 while循环

while循环是一种先测试循环语句，即先检测循环推出条件，再执行循环体内的代码。因此，while循环体内的代码有可能不会执行。语法为：

while (条件表达式) {
    // 循环体
}

智JavaScript 中的基本流程控制语句有_代码段_03


例如：

let i = 0; 
while (i < 10) { 
	i += 2; 
}

在这个例子中，变量i从0开始，每次循环递增2。只要i小于10，循环就会继续。

7 do…while循环

do…while语句是一种后测试循环语句，即它会无条件地执行一次循环体中的代码，然后再判断条件，根据条件决定是否循环执行，“直到”循环结束。其语法为：

do {
    // 循环体
} while (条件表达式);

注意：

  • do是关键字：必须和while结合使用，不能单独使用
  • 无论条件是否为真，循环体语句至少执行一次

    例如：
let i = 0; 
do { 
	i += 2; 
} while (i < 10);

在这个例子中，只要i小于10，循环就会重复执行。i从0开始，每次循环递增2。

8 for循环

for语句是最常用的循环语句，它也是先测试语句，它适合循环次数已知的情况。语法为：

for (初始化变量; 条件表达式; 操作表达式) {
    // 循环体
}

注意：

  • 三个表达式都可以省略，但是表达式之间的分号不能省略
  • 初始化变量：给循环变量、其他变量进行初始化
  • 条件表达式：控制循环体语句是否执行
  • 操作表达式：使循环趋向结束的语句

智JavaScript 中的基本流程控制语句有_if语句_04


例如：

let count = 10; 
for (let i = 0; i < count; i++) { 
	console.log(i); 
}

以上代码在循环开始前定义了变量i的初始值为0。然后求值条件表达式，如果求值结果为true，则执行循环体。因此循环体也可能不会被执行。如果循环体被执行了，则循环后表达式也会执行，以便递增变量i。

除此之外，还可以给for循环加标签，标签语句的典型应用场景是嵌套循环，语法如下：

label: statement;

例如：

let num = 0; 
outermost: 
for (let i = 0; i < 10; i++) { 
	for (let j = 0; j < 10; j++) { 
		if (i == 5 && j == 5) { 
			break outermost; 
 		} 
 		num++; 
	} 
} 
console.log(num); // 55

在这个例子中，outermost标签标识的是第一个for语句。正常情况下，每个循环执行10次，意味着num++语句会执行100次，而循环结束时console.log的结果应该是100。但是，break语句带来了一个变数，即要退出到的标签。添加标签不仅让break退出（使用变量j的）内部循环，也会退出（使用变量i的）外部循环。当执行到i和j都等于5时，循环停止执行，此时num的值是55。

例如：

let num = 0; 
outermost: 
for (let i = 0; i < 10; i++) { 
	for (let j = 0; j < 10; j++) {
		if (i == 5 && j == 5) { 
			continue outermost; 
		} 
		num++; 
	} 
} 
console.log(num); // 95

continue语句会强制循环继续执行，但不是继续执行内部循环，而是继续执行外部循环。当i和j都等于5时，会执行continue，跳到外部循环继续执行，从而导致内部循环少执行5次，结果num等于95。

9 for…in循环

for...in语句是一种严格的迭代语句，用于枚举对象中的非符号键（Symbol）属性，语法如下：

for (property in expression) statement

下面是一个例子：

for (const propName in window) { 
	document.write(propName); 
}

这个例子使用for...in循环显示了BOM对象window的所有属性。每次执行循环，都会给变量propName赋予一个window对象的属性作为值，直到window的所有属性都被枚举一遍。

由于对象的属性是无序的，因此for...in语句不能保证返回对象属性的顺序。换句话说，所有可枚举的属性都会返回一次，但返回的顺序可能会因浏览器而异。

如果for...in循环要迭代的变量是null或undefined，则不执行循环体。

10 for…of循环

for...of语句是一种严格的迭代语句，用于遍历可迭代对象的元素，语法如下：

for (property of expression) statement

下面是示例：

for (const el of [2, 4, 6, 8]) { 
 document.write(el); 
}

在这个例子中，我们使用for...of语句显示了一个包含4个元素的数组中的所有元素。循环会一直持续到将所有元素都迭代完。

11 continue关键字

continue关键字可以在for、while以及do…while循环体中使用，它用来立即跳出本次循环，也就是跳过了continue后面的代码，继续下一次循环。

示例代码：

let num = 0; 
for (let i = 1; i < 10; i++) { 
	if (i % 5 == 0) { 
		continue; 
	} 
	num++; 
} 
console.log(num); // 8

最终console.log显示8，即循环被完整执行了8次。当i等于5时，循环会在递增num之前退出，但会执行下一次迭代，此时i是6。然后，循环会一直执行到自然结束，即i等于10。最终num的值是8而不是9，是因为continue语句导致它少递增了一次。

12 break关键字

break关键字用于立即退出循环，强制执行循环后的下一条语句。

break关键字的用法：

  • 用在switch语句中，当遇到break语句时，跳出switch语句
  • 循环语句中使用时，其作用是立即跳出整个循环（将循环结束）

注意：break语句还可跳转到指定的标签语句处，实现循环嵌套中的多层跳转

示例代码：

let num = 0; 
for (let i = 1; i < 10; i++) { 
	if (i % 5 == 0) { 
		break;
	} 
	num++; 
} 
console.log(num); // 4

在上面的代码中，for循环会将变量i由1递增到10。而在循环体内，有一个if语句用于检查i能否被5整除。如果是，则执行break语句，退出循环。变量num的初始值为0，表示循环在退出前执行了多少次。当break语句执行后，下一行执行的代码是console.log(num)，显示4。之所以循环执行了4次，是因为当i等于 5 时，break语句会导致循环退出，该次循环不会执行递增num的代码。

13 with语句

with语句的用途是将代码作用域设置为特定的对象，其语法是：

with (expression) statement;

使用with语句的主要场景是针对一个对象反复操作，这时候将代码作用域设置为该对象能提供便利，如下面的例子所示：

let qs = location.search.substring(1); 
let hostName = location.hostname; 
let url = location.href;

上面代码中的每一行都用到了location对象。如果使用with语句，就可以少写一些代码：

with(location) { 
	let qs = search.substring(1); 
	let hostName = hostname; 
	let url = href; 
}

这里，with语句用于连接location对象。这意味着在这个语句内部，每个变量首先会被认为是一个局部变量。如果没有找到该局部变量，则会搜索location对象，看它是否有一个同名的属性。如果有，则该变量会被求值为location对象的属性。

注意：由于with语句影响性能且难于调试其中的代码，通常不推荐在产品代码中使用with语句