在 JavaScript 中用 var, let, 以及 const 有什么差別？什么时候该用哪个？

文章目录

在 JavaScript 中用 var, let, 以及 const 有什么差別？什么时候该用哪个？
- 1.作用域不同
- 2.声明上不同
- 3.变量提升不同
- 4.const 不允许重新赋值（rebind）
延伸问题：什么时候该用 let ? 什么时候用 const

前置知识:

若不了解 JS 原生值和对象，可以看如下博客JavaScript有哪些数据类型？如何判断一个变量的数据类型？

在 JavaScript 中用 var, let, 以及 const 有什么差別？什么时候该用哪个？

var、let 和 const 是 JavaScript 中用于声明变量的关键字，在 JavaScript 早期只有var，直到 ES2015 (ES6) 时才加入了let与const

他们之间主要有 4 点不同

作用域不同
声明上不同
变量提升上不同
const 不允许重新赋值

详细来说，

1.作用域不同

var可以是全局的，可以是以函数作为范围。 let 和 const则是以区块作为范围

2.声明上不同

var 可以反复的被重新声明但是 let 和 const不行

3.变量提升不同

var 声明的变量会发生提升，在作用域创建阶段即被声明并初始化为 undefined，因此在赋值之前访问该变量不会报错，而是得到 undefined。但是let和const声明的变量不会自动初始化，而是会进入到暂时死区（TDZ），在声明前使用会报错。

4.const 不允许重新赋值（rebind）

let 和 const 在绝大多数情况都是一样的，二者一个大区别在于，用原生值和对象正常来说是可以重新绑定的（重新绑定赋值），但是 const 不允许

接下来将会一一展开介绍：

1.作用域不同

在作用域上，var可以是全域、也可以是以函数作为范围，let和const則是以区块作为范围。当我們在一个文件的最外层使用var来宣告变量，这时它的范围就是全局，因此当我们在 console 中输入

var greeting = "hello"; window.greeting; // "hello"

其结果是 hello，但是用 let和 const 声明则不会有同样效果，var 除了在全局作用域，var 在某个函数中的范围就是该函数

2.声明上不同

var 可以重复声明

vargreeting="Hello! This ExplainThis :)";vargreeting="ExplainThis is a website that helps you learn programming!";

let 可以重新赋值（rebind），但是不能被重复声明

// 不行！不然会有 SyntaxError: Identifier 'greeting' has already been declaredletgreeting="Hello! This ExplainThis :)";letgreeting="ExplainThis is a website that helps you learn programming!";// 可以letgreeting="Hello! This ExplainThis :)";greeting="ExplainThis is a website that helps you learn programming!";

3.变量提升不同

var 变量提升，自动初始化

console.log(greeting);// undefinedvargreeting="hi there";

但是let和const则不会，而是會進到暂时死区 (TDZ)，因此在let和const声明变量前使用该变量，会出现错误：

console.log(greeting);// Uncaught ReferenceError: greeting is not definedletgreeting="hi there";

补充：

暂时性死区的地方,在这个区域里，任何对该变量的访问都会直接报错。只有当代码执行到声明该变量的那一行时，它才能被“激活”和访问。

4.const 不允许重新赋值（rebind）

const obj = { a: 1 } obj.a = 2 // ✅ 可以 obj.b = 3 // ✅ 可以 obj = { a: 100 } // 不可以，不能 rebind const string="hello world" string="hello js" //不可以，不能 rebind

let 是可以的，当然了 var 也可以