美文网首页
ES6学习——let 和 const 命令

ES6学习——let 和 const 命令

作者: lulu_c | 来源:发表于2018-11-28 14:39 被阅读55次

    let 命令

    let命令用来声明变量,用法类似于var,但是所声明的变量,只在let命令所在的代码块内(作用域)有效。

    { // let只在代码块内有效
      let a = 1;
      var b = 1;
    }
    
    a // ReferenceError: a is not defined.
    b // 1
    

    因此,很适合在循环体for内使用。

    例子:

    var a = [];
    for (var i = 0; i < 10; i++) {
      a[i] = function () {
        console.log(i);
      };
    }
    a[6](); // 10
    // a[function () {console.log(i);},function () {console.log(i);}.....] i=10
    
    var a = [];
    for (let i = 0; i < 10; i++) { 
     // (let i = 0; i < 10; i++)这里有父作用域,循环体内部是一个单独的子作用域
      a[i] = function () {
        console.log(i);
      };
    }
    a[6](); // 6
    

    a数组的每个元素都是一个函数,使用var声明是全局有效的,即只有一个变量i每次循环都会改变i的值,所以最终i为最后一次循环所得的10,而使用let声明的变量只在当前的一次循环里有效,JavaScript引擎记住每次循环的上一轮的i值,每次循环开始前都初始化一次新的i变量,整个循环里就产生了10个i值,作用域只在自己的循环里,所以输出的是各自的i值。

    let不存在变量提升

    // var 的情况
    console.log(foo); // 输出undefined
    var foo = 2;
    
    // let 的情况
    console.log(bar); // 报错ReferenceError
    let bar = 2;
    

    暂时性死区

    var tmp = 123;
    
    if (true) {
      tmp = 'abc'; // ReferenceError
      let tmp;
    }
    

    ES6 明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。let命令声明变量之前,该变量都是不可用的,为“暂时性死区”

    隐蔽死区

    function bar(x = y, y = 2) {  // x=y时y未定义
      return [x, y];
    }
    
    bar(); // 报错
    

    不允许重复声明
    let不允许在相同作用域内,重复声明同一个变量。

    // 报错
    function func() {
      let a = 10;
      var a = 1;
    }
    
    // 报错
    function func() {
      let a = 10;
      let a = 1;
    }
    

    const 命令

    const声明一个只读的常量。一旦声明,常量的值就不能改变。因此一旦声明变量,就必须立即初始化。
    const的作用域与let命令相同:只在声明所在的块级作用域内有效。其余特性与let一致。
    const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。如果真的想将对象冻结,应该使用Object.freeze方法。

    const foo = Object.freeze({});
    
    // 常规模式时,下面一行不起作用;
    // 严格模式时,该行会报错
    foo.prop = 123;
    

    资料:http://es6.ruanyifeng.com/#docs/let

    相关文章

      网友评论

          本文标题:ES6学习——let 和 const 命令

          本文链接:https://www.haomeiwen.com/subject/gnxvfqtx.html