一: 块级绑定 let和const

作者: 岁月静好_不负此生 | 来源:发表于2019-12-20 20:15 被阅读0次

    前言

    该部分为书籍 深入理解ES6 第一章(块级绑定)笔记

    var 声明 与变量提升

    • 使用 var 关键字声明的变量, 无论其实际声明位置在何处, 都会被视为声明于所在函数的顶部
    • 正因为变量提升的问题, 在 ES6 中引入了块级作用域, 让变量的生命周期更加可控

    块级声明

    • 块级声明也就是让所声明的变阿玲在指定块的作用域外无法被访问. 块级作用域(又被称为词法作用域)在如下情况被创建:
      1. 在一个函数内部
      2. 在一个代码块(由一对花括号包裹)内部

    let声明 和 const声明

    特性:

    1. 变量不会被提升到当前代码块的顶部

      function getValue(condition) {
        if (condition) {
          let value = "blue";
          // 其他代码
          return value;
         } else {
          // value 在此处不可用
          return null;
         }
         // value 在此处不可用
      }
      
    2. 禁止重复声明

      如果一个标识符已经在 代码块内部被定义, **不管这个标识符被定义的方式(使用var, const, let) **, 使用同一个标识符进行 let 声明就会导致抛出错误

      var count = 30;
      // 语法错误
      let count = 40;
      
    3. 会将变量的作用域限制在当前代码块中

      {
          let value = 'blue';
          console.log(value);// blue
      }
      console.log(value);// 抛出错误
      
    4. 全局作用域上定义的也不会添加到全局对象中

      使用 var 在全局作用域中定义的变量, 会成为全局对象(在浏览器中是window)的一个属性.

      var ncz = "Hi!";
      console.log(window.ncz); // "Hi!"
      
      const ncz = "Hi!";
      console.log(ncz); // "Hi!"
      console.log("ncz" in window); // false
      

    const声明其他特性

    特性:

    1. 需要在声明时进行初始化

      // 有效的常量
      const maxItems = 30;
      // 语法错误:未进行初始化
      const name;
      
    2. const 变量不能被再次赋值

      • 会阻止对于变量绑定与变量自身值的修改, 这也意味着 const 声明并不会阻止对变量成员的修改
      • const 阻止的是对于变量绑定的修改, 而不阻止对成员值的修改.
      const maxItems = 5;
      maxItems = 6; // 抛出错误
      
      const person = {
       name: "Nicholas"
      };
      // 工作正常
      person.name = "Greg";
      // 抛出错误
      person = {
       name: "Greg"
      };
      

    暂时性死区(TDZ)

    • letconst 声明的变量, 在达到声明处之前都是无法访问的, 试图访问会导致一个引用错误. 即使在通常是安全的操作时(例如使用 typeof 运算符), 也是如此

      if (condition) {
        console.log(typeof value); // 引用错误
        let value = "blue";
      }
      

    循环中的常量声明

    • 如下写法中就会报错 - 因为试图修改 i 常量

      var funcs = [];
      // 在一次迭代后抛出错误
      for (const i = 0; i < 10; i++) {
        funcs.push(function() {
            console.log(i);
        });
      }
      
      // 这样就不会报错
      var funcs = [],
      object = {
        a: true,
        b: true,
        c: true
      };
      // 不会导致错误
      for (const key in object) {
        funcs.push(function() {
            console.log(key);
        });
      }
      

    最佳实践

    • 在默认情况下使用 const , 而只在知道变量值需要被更改的情况下才使用 let

    相关文章

      网友评论

        本文标题:一: 块级绑定 let和const

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