By

文章目录
  1. 1. let && const
  2. 2. 变量的解构赋值（数组、对象、字符串、数值与布尔值、函数参数、圆括号）

    根据阮一峰老师《ECMAScript 6入门》的ES6学习笔记。

let && const

  1. let let声明的变量只在let命令所在的代码块内有效。

    1
    2
    3
    4
    5
    6
    7
    var a = [];
    for (let i = 0; i < 10; i++) {
      a[i] = function () {
        console.log(i);
      };
    }
    a[6](); // 6

    上面代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。

  2. 不存在变量声明提升
  3. 暂时性死区（TDZ）
  4. 不允许重复声明
  5. const 只在声明所在的块级作用域有效。对象冻结，应该使用Object.freeze方法
  6. 为了保持兼容性，var命令和function命令声明的全局变量，依旧是顶层对象的属性； 另一方面规定，let命令、const命令、class命令声明的全局变量，不属于顶层对象的属性。也就是说，从ES6开始，全局变量将逐步与顶层对象的属性脱钩。

变量的解构赋值（数组、对象、字符串、数值与布尔值、函数参数、圆括号）

  1. 等号右边的值，要么转为对象以后不具备Iterator接口，要么本身就不具备Iterator接口({})，这种都会解构失败。 解构赋值的规则是，只要等号右边的值不是对象，就先将其转为对象。由于undefined和null无法转为对象，所以对它们进行解构赋值，都会报错。
  2. 解构可以指定默认值，但如果一个数组成员不严格等于undefined，默认值是不会生效的。
  3. 1
    2
    let obj = { first: 'hello', last: 'world' };
    let { first: f, last: l } = obj;

    对于{first:f,last:l}来说，first是变量名，l是属性名 也就是说赋值后应该访问的是l;

    1
    let {foo} = {foo: 1}; //这种是变量名与属性名都是 foo

  4. 字符串的解构赋值

    1
    2
    const [a, b, c, d, e] = 'hello';
    let {length : len} = 'hello';//5

  5. 用途
    (1) 交换变量的值 

    1
    [x, y] = [y, x];

    (2) 从函数返回多个值
    (3)将一组函数参数与变量名连接起来 

    1
    2
    3
    4
    5
    6
    7
       // 参数是一组有次序的值
    function f([x, y, z]) { ... }
    f([1, 2, 3]);
    // 参数是一组无次序的值
    function f({x, y, z}) { ... }
    f({z: 3, y: 2, x: 1});

    (4) 提取JSON数据 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    var jsonData = {
      id: 42,
      status: "OK",
      data: [867, 5309]
    };
    let { id, status, data: number } = jsonData;
    console.log(id, status, number);
    // 42, "OK", [867, 5309]

    (5)函数参数的默认值 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    jQuery.ajax = function (url, {
        async = true,
        beforeSend = function () {},
        cache = true,
        complete = function () {},
        crossDomain = false,
        global = true,
        // ... more config
       }) {
        // ... do stuff
       };

    (6)遍历Map结构 

    1
    2
    3
    4
    5
    6
    7
    8
    9
    var map = new Map();
     map.set('first', 'hello');
     map.set('second', 'world');
     for (let [key, value] of map) {
       console.log(key + " is " + value);
     }
     // first is hello
     // second is world

    (7)输入模块的指定方法 加载模块时，往往需要指定输入那些方法。解构赋值使得输入语句非常清晰。

    1
    const { SourceMapConsumer, SourceNode } = require("source-map");
文章目录
  1. 1. let && const
  2. 2. 变量的解构赋值（数组、对象、字符串、数值与布尔值、函数参数、圆括号）