美文网首页
var、let、const 比较

var、let、const 比较

作者: 奋斗的小小小兔子 | 来源:发表于2018-09-21 10:45 被阅读7次

    let 和const 是ES6新定义的,存在一定特性。
    let用来声明变量,const 用来声明常量。

    一、块级作用域

    1. let、const具有块级作用域
    2. var不存在块级作用域,可以通过立即执行函数实现块级作用域

    如果在块级作用域外访问let声明的变量,就会报错。

    {
      let a = 1;
    }
    console.log(a);   // Uncaught ReferenceError: a is not defined
    
    

    如果在块级作用域外访问const声明的变量,会报错。

    {
      const a = 1;
    }
    console.log(a);   // Uncaught ReferenceError: a is not defined
    
    

    使用var声明的变量,不存在块级作用域,所以不会报错。

    {
      var a = 1;
    }
    console.log(a);   // 1
    

    使用var通过立即执行函数实现块级作用域

    (function(){
      var a = 1;
    })()
    console.log(a);    // Uncaught ReferenceError: a is not defined
    

    二、 先使用再声明

    1. let、const不能先使用再声明
    2. var可以先使用再声明

    let先使用,在声明,会报错

    console.log(a);  // Uncaught ReferenceError: a is not defined
    let a = 1;
    

    const先使用,在声明,会报错

    console.log(a);  // Uncaught ReferenceError: a is not defined
    const a = 1;
    

    const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

    const a;   // Uncaught SyntaxError
    

    var可以先使用再声明

    console.log(a);  //  1
    var a = 1;
    

    三、暂时性死区

    在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。

    1. let 、const 都存在暂时性死区

    2. var不存在块级作用域,而且具有变量提升,因此不存在暂时性死区

    let在块级作用域内,存在暂时性死区,任何声明前的调用都会报错。

    var a = 1;
    if(true) {
      console.log(a);   // Uncaught ReferenceError
      let a = 3;
    }
    
    

    const 在块级作用域内,存在暂时性死区,任何声明前的调用都会报错

    var a = 1;
    if(true) {
      console.log(a);   // Uncaught ReferenceError
      const a = 3;
    }
    
    

    var 不存在块级作用域

    var a = 1;
    if(true) {
      console.log(a);   //1
      var a = 3;
      console.log(a); //3
    }
    
    

    四、 相同作用域内,重复声明

    1. let、const不能重复声明
    2. var 可以重复声明

    let、const不能重复声明,会报错

    let a = 2;
    let a = 3;   // Uncaught SyntaxError
    
    const b = 2;
    const b = 3   // Uncaught SyntaxError
    
    

    var 可以重复声明,且以最后的声明为准

    var c =2;
    var c = 4;
    console.log(c);  // 4
    

    参考资料:

    ES6入门

    相关文章

      网友评论

          本文标题:var、let、const 比较

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