zoukankan      html  css  js  c++  java
  • ES6(let 和 const)

         一项新技术的出现肯定是为了解决一些问题,那么ES6的出现主要是解决了哪些问题?它的出现给我们带来了什么便利?当它没有出现的时候,某些问题怎么处理?ES6的方法和以前的方法比较又有什么不同呢?根据提出的这些问题,我开始了ES6学习之旅。

        ES6是在ES5的基础上对语法进行了修正以及添加了一些新的功能, 具体修正了哪些语法与添加了哪些新的功能,那就开始学习吧。

            let           

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

    {
    let a = 10;
    var b = 1;
    }
    a // ReferenceError: a is not defined.
    b // 1
    View Code

           以下代码会输出10,因为 i 是var声明的,在全局范围内都有效。所以每一次循环,新的 i 值都会覆盖旧值,导致最后输出的是最后一轮的 i 的值。如果 i 是let声明的,该变量仅在块级作用域内有效,最后输出的会是 6。

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

          我们都知道ES5中的变量会提升到顶部,所以可以先调用后声明,之所以可以是因为是var声明的,而let声明的变量不会提升,所以必须先声明才可以调用。还有,只要let命令存在于块级作用域内,它所声明的变量就"绑定"了这个区域,不再受外部的影响。例如如下代码:

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

       在块级作用域内使用let又声明变量tmp,那么这个变量就不会再受外部变量的影响,而let声明的变量无法提升,所以在没有声明前调用就会出错。

       总之,在代码块内,在没有使用let声明变量之前,该变量都是不可用的,这在ES6的语法上称为"暂时性死区","暂时性死区"的出现意味着typeof不再是一个百分之百安全的操作。

    typeof x; // ReferenceError
    let x;
    
    typeof  y // "undefined"
    View Code

         在没有声明x前,使用typeof检测x的类型就会报错,而检测一个没有被声明的变量反而不会报错。

         let还不允许在相同作用域内,重复声明同一个变量,如下情况都会报错:

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

         所以,在函数内重新声明变量也是会报错的

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

         在不同的作用域里重新声明变量是可以的:

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

            const  

               const声明一个只读的常量,一旦声明,常量的值就不能改变,因为无法改变,所以声明变量的时候就需要立即初始化变量,不能留到以后赋值。const的作用域与let命令相同:只在声明所在的块级作用域内有效,而且变量也是无法提升的,也存在"暂时性死区",只能声明后再调用,也不可以重复声明。

               对于复杂类型的变量,变量名不指向数据,而是指向数据所在的地址,const命令只是保证变量名指向的地址不变,并不保证该地址的数据不变,所以将一个对象声明为常量必须非常小心。

    const foo = {};
    foo.prop = 123;
    foo.prop
    // 123
    foo = {}; // TypeError: "foo" is read-only
    View Code

          常量foo储存的是一个地址,这个地址指向一个对象。不可变的只是这个地址,即不能把foo指向另一个地址,但对象本身是可变的,所以依然可以为其添加新属性。

          如果想将对象冻结,可以使用Object.freeze方法,一旦冻结,就无法为其添加新的属性,严格模式下会报错

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

         ES5 只有两种声明变量的方法:var命令和function命令。 ES6 除了添加let和const命令,还有另外两种声明变量的方法:import命令和class命令,以后再学习这两种声明变量的方法。

         

  • 相关阅读:
    职业生涯起步不要去顶级公司
    discuz uc密码修改
    习惯决定成功与否
    世上没有理想的工作
    中山市慧海人力资源服务有限公司
    Codeforces Round #365 (Div. 2) B 前缀和
    Codeforces Round #365 (Div. 2) A 水
    tyvj 1067 dp 两次LIS(nlogn)
    Codeforces Round #303 (Div. 2) D 贪心
    Codeforces Round #303 (Div. 2) C dp 贪心
  • 原文地址:https://www.cnblogs.com/yezi-dream/p/6147228.html
Copyright © 2011-2022 走看看