fangchaolong
文章57
标签24
分类10
javascript var、const、let的区别

javascript var、const、let的区别

es6 新增的变量 const、let 他们喝var的区别:变量提升

1、变量提升

什么是变量提升?
JavaScript 中,函数及变量的声明都将被提升到函数的最顶部,
JavaScript 中,变量可以在使用后声明,也就是变量可以先使用再声明。

var存在变量提升,let和const不存在变量提升,即在变量只能在声明之后使用,否在会报错。


console.log(a); // undefined  ===>  a已声明还没赋值,默认得到undefined值
var a = 100;


console.log(b); // 报错:b is not defined  ===> 找不到b这个变量
let b = 10;


console.log(c); // 报错:c is not defined  ===> 找不到c这个变量
const c = 10;

再来看这段代码


function fn() {
   //var a
    if (true) {
        console.log(a + ' now');
    }
    else {
        var a = 1;
        console.log(2);
    }
}

fn(); // a -> undefined

我们发现不执行的代码也会影响会执行的代码,因为var a会提升到if语句的前面。
在Java中变量的分为全局变量(成员变量)或者局部变量,在方法体中定义的变量都是局部变量,否则是全局变量(即在方法体外,在类中定义的变量)。
在JavaScript中,在方法体外外用var定义的变量其它方法可以共享,在方法中用var定义的变量只有该方法内生效。

2、块级作用域

块作用域由 { } 包括,let和const具有块级作用域,var不存在块级作用域。


if(1){
    var a = 100;
    let b = 10;
    const c = 1;
}

console.log(a); // 100
console.log(b);  // 报错:b is not defined  ===> 找不到b这个变量
console.log(c);  // 报错:c is not defined  ===> 找不到c这个变量

块级作用域解决了ES5中的两个问题:

内层变量可能覆盖外层变量
用来计数的循环变量泄露为全局变量

3、给全局添加属性

浏览器的全局对象是window,Node的全局对象是global。var声明的变量为全局变量,同时会将该变量添加为全局对象的属性,但是let和const就不会。


var a = 100;
console.log(a,window.a);    // 100 100


let b = 10;
console.log(b,window.b);    // 10 undefined


const c = 1;
console.log(c,window.c);    // 1 undefined

4、重复声明

var声明变量时,可以重复声明变量,const和let不能重复声明。



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

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

let b = 100;
let b = 10;
//  控制台报错:Identifier 'b' has already been declared  ===> 标识符a已经被声明了。

5、暂时性死区

如果块级作用域内存在let、const命令,它所声明的变量就“绑定”这个区域,不再受外部的影响。在代码块内,使用let、const命令声明变量之前,该变量都是不可用的。这在语法上,称为暂时性死区。


var a = 100;

if(1){
    a = 10;
    // 在当前块作用域中存在a使用let/const声明的情况下,给a赋值10时,只会在当前作用域找变量a,
    // 而这时,还未到声明时候,所以控制台Error:a is not defined
    let a = 1;
}

当前作用域顶部到该变量声明位置中间的部分,都是该变量的死区,在死区中,禁止访问该变量。“暂时性死区”也意味着typeof不再是一个百分之百安全的操作,因为会使typeof报错。


{
  typeof name; // ReferenceError
  let name;
}

6、初始值设置

在变量声明时,var 和 let 可以不用设置初始值,而const声明变量必须设置初始值,不能使用null占位。


const a; // 控制台报错:SyntaxError: Missing initializer in const declaration

无以生计,卖文苟延

微信
支付宝