美文网首页
js 中 var let const 的区别

js 中 var let const 的区别

作者: 前端_Fn | 来源:发表于2020-05-30 11:24 被阅读0次
    1. 很多人认为 var 和 let const 的区别在于,var 会变量提升,而 let const 不会,虽然可以这样认为,但是我觉得并不完全对。
    2. 在 JS 引擎解析代码的时候,遇到变量不同的声明方式过程是不一样的。

    通过 var 声明变量的过程

    console.log(a);  // undefined
    var a = 1;
    console.log(a);  // 1
    
    • 过程:
      • var 声明的变量会提升到顶部,创建 a 变量。
      • 创建完变量后会初始化 a,此时为 undefined。
      • 执行代码,将 a 变量值赋予 a 变量。

    这就是 var 变量声明之前,输出这个变量为 undefined 的原因了。


    通过 let 声明变量的过程

    {
        console.log(a);  // index.html:28 Uncaught ReferenceError: Cannot access 'a' before initializationat
        let a = 1;
        console.log(a);
    }
    let b = 1;
    let b = 2;  // Uncaught SyntaxError: Identifier 'a' has already been declared 
    

    第一个输出结果:无法在初始化之前访问 ' a '

    • 那么 let 声明的变量会提升吗?

    • 过程:

      • let 声明的变量在创建过程中被提升。
      • 开始执行代码,但未初始化,可以认为在变量初始化之前,是无法使用这个变量的。
      • 初始化代码,在修改变量的前提下赋值。

    第二个输出结果:未捕获的语法错误:已声明标识符 “a”

    • let 声明的变量是无法重复声明的。

    通过 const 声明变量的过程

    const a = 1;
    console.log(a);  // 1
    a = 2;  // Uncaught TypeError: Assignment to constant variable.at
    

    重新赋值了常量变量。也就是重新修改了const声明的变量的值。

    • const 和 let 只有一个区别,就是 const 声明的变量过程只有两步。
    • 创建和初始化,没有赋值的过程。所以无法给 const 变量进行重新赋值。

    const 和 let 具有块级作用域

    {
        var a = 1;
        let b = 2;
        const c = 3;
    }
    console.log(a);  // 1
    console.log(b);  // ReferenceError: b is not defined
    console.log(c);  // ReferenceError: c is not defined
    

    我们会发现,let 和 const 只限于当前作用域的,外部作用域时无法访问到的,那么两者声明的变量是属于 window 的吗?

    var a = 1;
    let b = 2;
    const c = 3;
    console.log(window.a);  // 1
    console.log(window.b);  // undefined
    console.log(window.c);  // undefined
    

    看完结果之后,在全局作用域中 var 和 不使用 var 声明的变量都是属于 window 的,而 let const 不是。

    相关文章

      网友评论

          本文标题:js 中 var let const 的区别

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