美文网首页
JavaScript ECMAScript 6 笔记 -1

JavaScript ECMAScript 6 笔记 -1

作者: json_jie | 来源:发表于2017-09-27 11:56 被阅读4次

    Node 是 JavaScript 的服务器运行环境

    检测浏览器对ES6的支持的程度

    npm install -g es-checker
    es-checker
    

    Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从而在现有环境执行

    let var 关键字

    ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

    屏幕快照 2017-09-27 上午11.28.59.png

    var命令声明的i,在全局范围内都有效,所以全局只有一个变量i
    let声明的i,当前的i只在本轮循环有效

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

    var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined
    let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

    屏幕快照 2017-09-27 上午11.40.49.png

    暂时性死区

    只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。

    var tmp = 123;
    
    if (true) {
      tmp = 'abc'; // ReferenceError
      let tmp;
    }
    上面代码中,存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错。
    

    ES6明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错
    使用let,const声明变量时,只要变量在还没有声明完成前使用,就会报错

    不能在函数内部重新声明参数

    function func(arg) {
      let arg; // 报错
    }
    
    function func(arg) {
      {
        let arg; // 不报错
      }
    }
    

    let实际上为 JavaScript 新增了块级作用域。

    function f1() {
      let n = 5;
      if (true) {
        let n = 10;
      }
      console.log(n); // 5
    }
    

    面的函数有两个代码块,都声明了变量n,运行后输出5。这表示外层代码块不受内层代码块的影响。如果两次都使用var定义变量n,最后输出的值才是10。

    ES6 允许块级作用域的任意嵌套。

    const 命令

    const声明一个只读的常量。一旦声明,常量的值就不能改变。
    const一旦声明变量,就必须立即初始化,不能留到以后赋值。

    const的作用域与let命令相同:只在声明所在的块级作用域内有效。
    const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用

    const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心

    const foo = {};
    
    // 为 foo 添加一个属性,可以成功
    foo.prop = 123;
    foo.prop // 123
    
    // 将 foo 指向另一个对象,就会报错
    foo = {}; // TypeError: "foo" is read-only
    

    var命令和function命令声明的全局变量,依旧是顶层对象的属性;
    另一方面规定,let命令、const命令、class命令声明的全局变量,不属于顶层对象的属性。
    也就是说,从ES6开始,全局变量将逐步与顶层对象的属性脱钩。

    相关文章

      网友评论

          本文标题:JavaScript ECMAScript 6 笔记 -1

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