• es6读书笔记(一)——let


    文章内容摘自阮一峰的 ECMAScript 6 入门

    ES6新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,

    • 只在let命令所在的代码块内有效,并且不存在变量提升(也叫预解释)。
    {
      let a = 10;
      var b = 1;
    }
    
    a // ReferenceError: a is not defined.
    b // 1
    

      上面代码在代码块之中,分别用letvar声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

    for循环的计数器,就很合适使用let命令。

    var a = [];
    for (let i = 0; i < 10; i++) {
      a[i] = function () {
        console.log(i);
      };
    }
    a[6](); // 6
    

      上面代码中,变量ilet声明的,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是6。你可能会问,如果每一轮循环的变量i都是重新声明的,那它怎么知道上一轮循环的值,从而计算出本轮循环的值?这是因为 JavaScript 引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计另外,for循环还有一个特别之处,就是循环语句部分是一个父作用域,而循环体内部是一个单独的子作用域。

    for (let i = 0; i < 3; i++) {
      let i = 'abc';
      console.log(i);
    }
    // abc
    // abc
    // abc

    上面代码输出了3次abc,这表明函数内部的变量i和外部的变量i是分离的。

    • 暂时性死区 
      只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响
      var tmp = 123;
      
      if (true) {
        tmp = 'abc'; // ReferenceError
        let tmp;
      }
      View Code

      上面代码中,存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错
      ES6明确规定,如果区块中存在letconst命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域(暂时性死区)凡是在声明之前就使用这些变量,就会报错

    • 暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量
      function bar(x = y, y = 2) {//逗号的结合性是从左到右,所以先计算x=y表达式,所有报错。
        return [x, y];
      }
      
      bar(); // 报错
      // 不报错
      var x = x;
      
      // 报错
      let x = x;
      // ReferenceError: x is not defined
      //在变量x的声明语句还没有执行完成前,就去取x的值,导致报错”x 未定义“
    • 不允许重复声明,let不允许在相同作用域内,重复声明同一个变量

    • ES6 声明变量的六种方法 

      ES5 只有两种声明变量的方法:var命令和function命令。ES6除了添加letconst命令,后面章节还会提到,另外两种声明变量的方法:import命令和class命令。所以,ES6 一共有6种声明变量的方法。

  • 相关阅读:
    java 时间操作
    springboot-helloworld 学习02
    springboot-helloworld 学习01
    java知识图谱
    python day100-[day41-45]-5 web-django RESTful架构和DRF入门
    python day100-[day41-45]-4 web-django 前后端分离
    hive mysql count distinct 多列
    hive 导出数据到文件
    使用npm i 编译vue项目出现无法拉取clone github.com中的源文件
    windows环境下elasticsearch安装教程 (版本为7.12.0)
  • 原文地址:https://www.cnblogs.com/tblj/p/6916207.html
Copyright © 2020-2023  润新知