javascript的var与let,const之间的区别详解

却写杂布计

目录

• 作为全局变量时
  
• 变量提升
  
• 暂时性死区
  
• 块级作用域
  
• 重复声明
  
• 修改声明的变量（常量与变量声明）
  
• 总结
  

说到

1. JavaScript

复制代码

中声明变量的几种方法也就是

1. var

复制代码

、

1. let

复制代码

、

1. const

复制代码

了，

1. let

复制代码

和

1. const

复制代码

是

1. es6

复制代码

中新增的命令。那么它们之间有什么区别呢？
我们先整体说一下三者的区别，在详细介绍，var、let、const的区别主要从以下几点分析：

• 作为全局变量时的不同
  
• 变量提升
  
• 暂时性死区
  
• 块级作用域
  
• 重复声明
  
• 修改声明的变量
  

作为全局变量时

在

1. ES5

复制代码

中，顶层对象的属性和全局变量是等价的，用

1. var

复制代码

声明的变量既是全局变量，也是顶层变量的属性
但是

1. ES6

复制代码

中用

1. let

复制代码

声明的变量可以在全局访问到，但是并没有在顶层变量的属性上，

1. const

复制代码

声明的常量同样也不会在顶层变量上

变量提升

1. var

复制代码

声明的变量存在变量提升，及变量可以在声明之前调用，值为undefined

1. let

复制代码

和

1. const

复制代码

不存在变量提升，即它们所声明的变量一定要在声明后使用，否则会报错

1. console.log(a)  // undefined
   
2. var a = 1
   
3. 
   
4. console.log(b)  // Cannot access 'b' before initialization
   
5. let b = 2
   
6. 
   
7. console.log(c)  // Cannot access 'c' before initialization
   
8. const c = 3console.log(a)  // undefined
   
9. var a = 1
   
10. 
    
11. console.log(b)  // Cannot access 'b' before initialization
    
12. let b = 2
    
13. 
    
14. console.log(c)  // Cannot access 'c' before initialization
    
15. const c = 3

复制代码

暂时性死区

1. var

复制代码

不存在暂时性死区

1. let

复制代码

和

1. const

复制代码

存在暂时性死区，只有等到声明变量的那一行代码被执行后，才可以获取和使用该变量
其实这一点就是有上一点变量提升延伸而来的区别。因为

1. var

复制代码

声明的变量存在变量提升，在声明之前使用该变量值为

1. undefined

复制代码

，不会报错，所有没有暂时性死区。

1. let

复制代码

、

1. const

复制代码

在该作用域开始前后，变量或常量声明之前使用会报错，这一块区域也就被称为暂时性死区
例同上文：

1. console.log(a)  // undefined
   
2. var a = 1
   
3. 
   
4. console.log(b)  // Cannot access 'b' before initialization
   
5. let b = 2
   
6. 
   
7. console.log(c)  // Cannot access 'c' before initialization
   
8. const c = 3

复制代码

块级作用域

1. var

复制代码

不存在块级作用域

1. let

复制代码

和

1. const

复制代码

存在块级作用域

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

复制代码

重复声明

1. var

复制代码

在相同作用域下允许重复声明，后面声明的变量会覆盖前面的变量声明

1. let

复制代码

、

1. const

复制代码

在相同作用域下不允许重复声明

1. var a = 10
   
2. var a = 20 // 20
   
3. 
   
4. let b = 10
   
5. let b = 20 // Identifier 'b' has already been declared
   
6. 
   
7. const c = 10
   
8. const c = 20 // Identifier 'c' has already been declared

复制代码

修改声明的变量（常量与变量声明）

1. var

复制代码

和

1. let

复制代码

声明的是变量，声明后的变量可被修改

1. const

复制代码

声明得失常量，只读。一旦声明，常量的值就不能改变。但是需要注意的是，对于引用数据类型，

1. JavaScript

复制代码

中的变量或者常量存储的是该数据的存储地址，只要不直接修改该常量的引用，修改其指向的对象的属性是可以的。

1. var a = 10
   
2. a = 20
   
3. console.log(a)  // 20
   
4. 
   
5. let b = 10
   
6. b = 20
   
7. console.log(b)  // 20
   
8. 
   
9. const c = 10
   
10. c = 20 // Uncaught TypeError: Assignment to constant variable

复制代码

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!
                                                        
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！