这里有一份简洁的前端知识体系等待你查收，看看吧，会有惊喜哦~如果觉得不错，恳求star哈~

前言

脚本、模块、函数体都是由语句列表构成的，这里先从语法的角度探索JS的语句。

在 JS 标准中，把语句分成了两种：声明语句和普通语句，接下来逐一分析。

声明型语句跟普通语句最大区别就是声明型语句响应预处理过程，普通语句只有执行过程。

普通语句

普通语句的种类如下：

语句块
空语句
表达式语句：后面详细介绍
if语句
switch语句
循环语句
return语句
break语句和continue语句
with语句
try语句和throw语句
debugger语句

这些语句都是工作中经常遇到的，这里只对个别语句做简要介绍。

switch语句

在C时代，switch生成的汇编代码性能是略优于if else的，但是对 JS 来说，则无本质区别，建议用if else结构代替。

循环语句

循环语句有如下形式：while、do while、for、for in、for of 和 for await of。

这里只重点介绍 for in、 for of、for await of。

for in

for in 循环枚举对象的属性，这里体现了属性的enumerable特征。

for of

for of、for await of 是ES6新加的语法特性，背后是iterator机制。

for of基本用法，可以用于数组：

for(let e of [1, 2, 3, 4, 5])
console.log(e);

我们可以给任何一个对象添加iterator，使它可以用于for of语句，看下示例：

let o = {
  [Symbol.iterator]: () => ({
    _value: 0,
    next () {
      if (this._value == 10) {
        return {
          done: true,
        };
      } else {
        return {
          value: this._value++,
          done: false,
        };
      }
    },
  }),
};
for (let e of o) {
  console.log (e);
}

实际操作中，我们一般不需要这样定义 iterator ，我们可以使用generator function。

function* foo(){
  yield 0;
  yield 1;
  yield 2;
  yield 3;
}
for(let e of foo()){
  console.log(e);
}

for await of

JavaScript还为异步生成器函数配备了异步的for of，也就是for await of。

function sleep(duration) {
  return new Promise(function (resolve, reject) {
    setTimeout(resolve, duration);
  })
}
async function* foo() {
  i = 0;
  while (true) {
    await sleep(1000);
    yield i++;
  }
}
for await (let e of foo()){
  console.log(e);
}

break语句和continue语句

控制型语句，break语句用于跳出循环语句或者switch语句，continue语句用于结束本次循环并继续循环。都有带标签的写法。

outer: for (let i = 0; i < 100; i++)
  inner: for (let j = 0; j < 100; j++)
    if (i == 50 && j == 50)
      break outer;
outer: for (let i = 0; i < 100; i++)
  inner: for (let j = 0; j < 100; j++)
    if (i >= 50 && j == 50)
      continue outer;

with语句

把对象的属性在它内部的作用域内变成变量，不建议使用。

具体原因，在基本规则篇介绍过。

try语句和throw语句

try语句和throw语句用于处理异常。它们是配合使用的。

try语句用于捕获异常，用throw抛出的异常，可以在try语句的结构中被处理掉。

try语句常用的结构是这样的。

try {

} catch(err) {

} finally {

}

try部分用于标识捕获异常的代码段，catch部分则用于捕获异常后做一些处理，而finally则是用于执行后做一些必须执行的清理工作。

throw用于抛出异常，但是单纯从语言的角度，我们可以抛出任何值，也不一定是异常逻辑，但是为了保证语义清晰，不建议用throw表达任何非异常逻辑。

finally语句一般用于释放资源，它一定会被执行，即使在try中出现了return，finally中的语句也一定要被执行。

声明型语句

声明语句的种类如下：

var 语句
let 语句
const 语句
class 语句：默认内部的函数定义都是strict模式的
函数声明

注意

声明型语句跟普通语句最大区别就是声明型语句响应预处理过程，普通语句只有执行过程
函数声明有四种，分别是：普通函数声明、async 函数声明、generator 函数声明、async generator 函数声明。（关于这四种函数声明，详见基本规则中的介绍）
生成器函数可以理解为返回一个序列的函数，它的底层是iterator机制。
async函数是可以暂停执行，等待异步操作的函数，它的底层是Promise机制。

结语

今天我们一起学习了语句家族，语句分成了普通语句和声明型语句。

普通语句部分，建议你把重点放在循环语句上面。声明型语句都很重要，尤其是它们的行为。熟练掌握了它们，我们就可以在工作中去综合运用它们，从而减少代码中的错误。新特性大多可以帮助我们发现代码中的错误。

JS语句

前言