zoukankan      html  css  js  c++  java
  • let和const

    一、let命令

    1、块级作用域

    ES5只有全局作用域和函数作用域,没有块级作用域,因此会出现下面这样的问题:

    for(var i = 0; i < 10; i ++){
    
    }
    console.log(i);

    代码块内声明的变量,代码块外一样可以访问。这种情况很多时候是不合理的。

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

    进行 10 次循环,第一次全局声明变量 i,之后每次更新 i 的值,数组 arr 保存着 10 个函数,每个函数等到运行时访问全局变量 i ,当然每次调用函数都是输出 10。这个问题下面的介绍就能解决。

    2、基本使用

    ES6新增了 let 命令,和 var 一样,也是用来声明变量的。但它所声明的变量,只在代码块内有效。

    for(let i = 0; i < 10; i ++){
    
    }
    console.log(i);   // error
    
    if(true){ let a = 10; } console.log(a); // error

    3、不存在变量提升

    ES5中使用 var 是会发生变量提升的:

    console.log(i);
    var i = 0;   // undefined
    
    // 等同于
    
    var i;
    console.log(i);
    i = 0;

    ES6中使用 let 不会:

    console.log(i);   // error
    let i = 10;

    4、暂时性死区

    代码块内的变量不论是ES5还是ES6都可以往上查找值的:

    var a = 10;
    if(true){
        console.log(a);   // 10
    }
    
    let a = 10;
    if(true){
        console.log(a);   // 10
    }

    但是只要块级作用域内使用了 let 命令,它所声明的变量,就绑定了这个区域,不再受外部的影响,下面这种情况会报错:

    let a = 10;
    if(true){
        console.log(a);   // error
        let a;
    }

    因为let命令没有变量提升,所以你在变量声明之前使用该变量就是不行,不管你代码块外部做了什么操作,所以如果你决定使用ES6语法规则,还是老老实实先定义后使用吧。

    5、不允许在同一个作用域内重复声明变量

    ES5中重复声明变量是没有问题的:

    var a = 10;
    var a = 20;
    console.log(a);   // 20

    ES6很较真,你敢这样做,我就敢报错:

    let a = 10;
    let a = 20;   // error

    别忘了,ES6是有块级作用域的,所以下面这样还是完全可以的:

    let a = 10;
    if(true){
        let a = 20;
        console.log(a);
    }
    console.log(a);
    // 20
    // 10

    现在解决上面那个问题,就很简单了:

    let arr = [];
    for(let i = 0; i < 10; i ++){
        arr[i] = () => {
            console.log(i);
        }
    }
    arr[3]();   // 3

    二、const命令

     1、基本使用

    ES6中声明一个只读的常量是用 const,它与 let 大部分都相同:

    • 不允许重复声明
    • 拥有块级作用域
    • 声明的常量不会变量提升
    • 存在暂时性死区

    但有俩点不同。

    1、一旦声明,就要初始化(按照规定,常量最好使用大写):

    const A;   // error

    所以还是声明就立即赋值吧:

    const A = 10;

    2、第二点不同就是,不可后面更改它的值:

    const A = 10;
    A = 20;   // error

    注意:

    由于在 js 中,一个变量保存着一个复合类型(ArrayObjectFunction)的数据,仅仅保存的是该数据的地址,所以只要地址不换,就不会报错:

    const MYARRAY = ['apple', 'banana'];
    MYARRAY.push('orange');
    console.log(MYARRAY);   // [ "apple", "banana", "orange" ]
    
    const MYOBJECT =  {
        username: 'tom'
    };
    MYOBJECT.age = 24;
    console.log(MYOBJECT);   // { username: "tom", age: 24 }

    只有把地址都换了,才报错:

    const MYOBJECT = {
        username: 'tom'
    };
    MYOBJECT = {   // error
        username: 'tom',
        age: 24
    };

     上面代码其实是为常量 MYOBJECT 重新赋值了一个对象。

  • 相关阅读:
    ACM的算法分类 2015-04-16 14:25 22人阅读 评论(0) 收藏
    初学Larevel 2014-08-21 11:24 90人阅读 评论(0) 收藏
    初学PHP&MySQL 2014-05-31 12:40 92人阅读 评论(0) 收藏
    codeforces 570 E. Pig and Palindromes (dp)
    codeforces 570 D. Tree Requests (dfs序)
    poj 2157 Maze (bfs)
    cf 570 C. Replacement (暴力)
    cf 570B B. Simple Game(构造)
    cf 570 A. Elections
    hdu 1429胜利大逃亡(续) (bfs+状态压缩)
  • 原文地址:https://www.cnblogs.com/xlj-code/p/10347805.html
Copyright © 2011-2022 走看看