JavaScript开发：流程控制语句在实际开发中的使用总结

本文以《JavaScript高级程序设计》第4版作为参考，整理使用JavaScript开发过程中，使用流程控制语句相关的知识点。

本文是开发知识点系列第五篇。

在我看来操作符和流程控制语句都是逻辑的具体体现，不同的是操作符颗粒度更细，流程控制语句颗粒度大一些。下面着重总结各种流程控制语句（下简称语句）在实际开发中的使用情况和使用频次。

if语句

if语句是在实际开发中使用最为频繁的语句之一。

js 复制代码

if(condition) statement1 else statement2

condition可以是任意合法表达式，并且求解结果不一定是布尔值。JavaScript会自动调用Boolean()函数将结果转为布尔值。

do-while语句

do while是至少执行一次的语句。

js 复制代码

do {
  statement
}
while(expression)

expression也可以是任意合法表达式，并且求解结果不一定是布尔值。JavaScript会自动调用Boolean()函数将结果转为布尔值。

while语句

不同于do while，while是有循环条件的，符合条件才会执行。数据转换规则同上。

js 复制代码

while(expression) statement

for语句

for语句也是在实际开发中使用最为频繁的语句之一。for的伪代码表示。

js 复制代码

for(initialization;expression;post-loop-expression) statement

实际上for的初始化、条件表达式和循环后表达式都不是必需的。下面表达式则是一个无穷循环。

js 复制代码

for(;;){
  doSomething()
}

如果只包含条件表达式，那么for循环实际上就变成了while循环。

js 复制代码

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

for语句还可以这样

js 复制代码

for (let i = 0;; i++) {
  console.log(i);
  if (i >= 10) {
    break;
  }
}

还可以这样，自动结束

js 复制代码

const fns = [1, 2, 3, 4]
for( let i = 0, fn; fn = fns[ i++ ]; ){
    console.log(fn) // 1、2、3、4
}

另外就是用于循环的变量i基本后面就不会用到了，所以最好用let声明，这样就将变量限定在循环中。

for-in语句

for in用于枚举对象中的非符号键属性，符号键指的是Symbol声明的属性。另外不可枚举的对象属性是不可以用for in遍历的。另外for in循环要迭代的变量如果是null或undefined，不会报错，只是不执行循环体。

for-of语句

for...of语句用于遍历可迭代对象的元素。可迭代对象包括数组、字符串、Set、Map等。

遍历数组：

javascript 复制代码

let arr = [1, 2, 3, 4, 5];
for (let value of arr) {
  console.log(value);
}
// 输出：1 2 3 4 5

遍历字符串：

javascript 复制代码

let str = 'Hello, World!';
for (let char of str) {
  console.log(char);
}
// 输出：H e l l o ,   W o r l d !

遍历Set：

javascript 复制代码

let set = new Set([1, 2, 3, 4, 5]);
for (let value of set) {
  console.log(value);
}
// 输出：1 2 3 4 5

遍历Map：

javascript 复制代码

let map = new Map([['name', 'Alice'], ['age', 20]]);
for (let [key, value] of map) {
  console.log(key, value);
}
// 输出：name Alice  age 20

for...of语句不能用于遍历普通对象的属性，因为普通对象不是可迭代对象。如果想遍历普通对象的属性，可以使用for...in语句或者Object.keys方法。

另外，也可以在自定义对象上实现Symbol.iterator方法，使得这个对象成为可迭代对象，然后就可以使用for...of语句来遍历这个对象的元素。

以下是一个示例：

js 复制代码

let obj = {
  a: 1,
  b: 2,
  c: 3,
  [Symbol.iterator]() {
    let properties = Object.keys(this);
    let count = 0;
    let isDone = false;

    let next = () => {
       if (count >= properties.length) {
         isDone = true;
       }
       let value = this[properties[count++]];
       return { done: isDone, value };
    };

    return { next };
  }
};

for (let value of obj) {
  console.log(value);  // 输出 1, 2, 3
}

标签语句

标签语句是给语句添加标签，以便将来使用break或continue语句引用。

javascript 复制代码

outer: for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    if (i === 1 && j === 1) {
      break outer;
    }
    console.log(`i = ${i}, j = ${j}`);
  }
}
// 输出：
// i = 0, j = 0
// i = 0, j = 1
// i = 0, j = 2

标签语句在JavaScript中并不常用，因为它们会使代码变得难以理解和维护。在大多数情况下，应该尽量避免使用标签语句，而是使用函数、return语句和throw语句来控制程序的流程。

break和continue语句

break和continue是两种用于控制循环流程的语句。

break语句：用于立即退出当前的循环，跳过剩余的循环体，并继续执行循环后面的代码。

javascript 复制代码

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break;
  }
  console.log(i);
}
// 输出：0 1 2 3 4

continue语句：用于跳过当前的循环体，并立即开始下一次循环。

javascript 复制代码

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    continue;
  }
  console.log(i);
}
// 输出：0 1 2 3 4 6 7 8 9

break和continue语句还可以与标签语句一起使用，以便跳出多层嵌套的循环。

with语句

with语句用于临时改变代码中的作用域链。

javascript 复制代码

with (expression) {
  statement
}

expression是一个对象，statement是一个或多个语句。在statement中，可以直接访问expression对象的属性，而不需要写出对象的名称。

javascript 复制代码

let obj = { x: 10, y: 20 };
with (obj) {
  console.log(x);  // 输出：10
  console.log(y);  // 输出：20
}

with语句在JavaScript中并不推荐使用，因为它会使代码变得难以理解和维护。在严格模式下，with语句是禁止使用的。如果需要访问一个对象的多个属性，应该使用其他方式，例如将对象的引用存储在一个变量中。

switch语句

在JavaScript中，switch语句用于基于不同的条件执行不同的代码块。

switch语句的语法如下：

javascript 复制代码

switch (expression) {
  case value1:
    // 当expression的值等于value1时，执行这里的代码
    break;
  case value2:
    // 当expression的值等于value2时，执行这里的代码
    break;
  // 可以有任意数量的case子句
  default:
    // 当expression的值与所有case子句的值都不匹配时，执行这里的代码
}

一个例子

javascript 复制代码

let fruit = 'apple';
switch (fruit) {
  case 'banana':
    console.log('I am a banana.');
    break;
  case 'apple':
    console.log('I am an apple.');
    break;
  default:
    console.log('I am not a banana or an apple.');
}
// 输出：I am an apple.

每个case子句的末尾通常会有一个break语句，用于退出switch语句。如果没有break语句，那么switch语句会继续执行下一个case子句，直到遇到break语句或者switch语句的结束。这被称为"贯穿"（fallthrough）。

另外switch语句中的case是严格相等（===）运算符。

其他语句

除了已经提到的for、while、break、continue、with、switch等语句外，还有以下一些常见的语句：

try...catch语句：用于捕获和处理异常。

javascript 复制代码

try {
  throw new Error('Something went wrong');
} catch (e) {
  console.log(e.message);
}

throw语句：用于抛出一个异常。

javascript 复制代码

throw new Error('Something went wrong');

return语句：用于从函数中返回一个值。

javascript 复制代码

function add(x, y) {
  return x + y;
}

import和export语句：用于模块的导入和导出。

javascript 复制代码

import { add } from './math.js';
export function add(x, y) {
  return x + y;
}

总结一下

条件语句比如if、while、do while圆括号里面都可以是表达式，且表达式结果会自动转换为布尔值，这就比较好了，减少了不确定性
for循环语句有多种形态，可以变成while语句，可以自动结束，初始化、条件表达式和循环后表达式都不是必需的
for in不可以遍历符号键属性以及不可以遍历不可枚举属性
for of是不可以遍历普通对象的，可以遍历数组、字符串、Set、Map等
标签语句都配合break 和 continue使用，break 和 continue用于退出循环体和跳过当前循环
with并不推荐使用
switch条件判断是完全相等
在所有遍历中for倒序遍历性能最好，正序次之，forEach慢

本文完。