美文网首页
let,const以及var三者的区别

let,const以及var三者的区别

作者: 麻雀起 | 来源:发表于2019-03-13 16:05 被阅读0次

    1、首选let是es6新增的声明变量的方式 ,有以下特点:

    (1)作用域是块级作用域(在ES6之前,js只存在函数作用域以及全局作用域)

    在一个块级作用域中,变量唯一存在,一旦在块级作用域中用let声明了一个变量,那么这个变量就唯一属于这个块级作用域,不受外部变量的影响;

    let a=2;
    console.log(a);//a=2
    if(1){
      let a=1;
      console.log(a);//a=1
    }
    
    (2)不存在变量声明提前

    声明提升区别:
    let声明的变量不会提升;
    var声明的变量会提升到作用域的头部;

    console.log(a);//undefined
    console.log(b); //报错,错误信息:b is not defined**此例在小程序中都会打印undefined**
    var a=1;
    let b=2;
    
    console.log(b); //报错,错误信息:Identifier 'b' has already been declared
    let b=2;
    
    (3) 不能重复定义
    let a=1;
    let a=2;
    console.log(a);//Identifier 'a' has already been declared
    
    (4)存在暂时性死区:可以这样来理解
    var a=1;
    if(1){
    console.log(a);
      let a=2;// a is not defined
    }
    

    I:无论在块中的任何地方声明了一个变量,那么在这个块级作用域中,任何使用这个名字的变量都是指这个变量,无论外部是否有其他同名的全局变量;

    II:暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。

    III: 暂时性死区的意义:让我们标准化代码。将所有的变量的声明放在作用域的最开始。

    (5)块级作用域和不能声明提前可导致
    let a=5;
    function test(){
    console.log(a);//undefined --不能声明提前
    let a=4;
    console.log(a);//a=4
    }
    test()
    console.log(a);//a=5 --块级作用域
    
    (6)如果这个块级为全局的话
    let a=5;
    function test(){
    a=4;
    console.log(a);//a=4
    }
    test()console.log(a);//a=4 -- test()的改变影响到了全局
    

    2、 const一般用来声明常量,且声明的常量是不允许改变的,只读属性,因此就要在声明的同时赋值:

    const与let一样,都是块级作用域,存在暂时性死区,不存在变量声明提前,不允许重复定义

    const A=1;(重新给常量A赋值会报错 )
    A=3;// Uncaught TypeError: Assignment to constant variable.(错误:赋值给常量)
    

    3、 var 是es6之前 js用来声明变量的方法,其特性是:

    (1)var的作用域是函数作用域,在一个函数内利用var声明一个变量,则这个变量只在这个函数内有效
    function test(){
    var a=1;
    console.log(a);//函数未调用 输出的是undefined  函数调用输出的是1
    }
    console.log(a);//ReferenceError:a is not defined
    
    (2)存在变量声明提前(虽然变量声明提前,但变量的赋值并没有提前,因此下面的程序不会报错,但a的值为undefined)
    function test(){
    console.log(a);//undefined
    var a=3/a=3(隐式声明)
    }
    
    (3)var在全局作用域中定义的变量值可以在函数中修改,但若在函数重新var一个同名变量,在不影响同名的全局变量
    var a=5;
    var b=5;
    function test(){
    a=4;
    var b=4;
    console.log(a);//a=4 -- 函数中修改
    console.log(b);//b=4 -- 重新var一个同名变量
    }
    test()
    console.log(a);//a=4
    console.log(b);//b=5
    

    4、var和let区别

    function fn1(){
        for(var i=0;i<3;i++){
            setTimeout(function(){
                console.log(i);//3,3,3
            },0)
        }
        for(let j=0;j<3;j++){
            setTimeout(function(){
                console.log(j);//0,1,2
            },0)
        }
        console.log(i);//3
        console.log(j);//报错,错误信息: j is not defined
    }
    

    区别分析:由于代码执行顺序为:先同步后异步。
    循环1结果解析:
    var的作用于范围是函数内,又因setTimeout中异步函数后执行,执行时i变量值为3,所以输出结果均为3
    循环2结果解析:
    let 不存在变量提升,所以每次循环都会执行一次,声明一个新变量(只是初始化的值不一样)。for 的每次循环都是不同的块级作用域,而 let 声明的变量是块级作用域的,所以也不存在重复声明的问题。

    学习笔记,仅做参考;如有问题,恭亲指正

    相关文章

      网友评论

          本文标题:let,const以及var三者的区别

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