JavaScript 入门：变量声明 var/let/const 一次分清

在 JavaScript 编程中，变量声明是基础且关键的概念。随着 ES6（ECMAScript 2015）的引入，我们拥有了三种声明变量的方式：var、let 和 const。本文将深入探讨这三者的区别、特性以及最佳实践，帮助您一次分清它们。

一、var：JavaScript 的原始变量声明方式

1.1 var 的基本特性

var 是 JavaScript 早期提供的变量声明方式。它属于函数作用域，即在函数内部声明的变量在整个函数内都有效，但在块级作用域（如 if、for 等代码块）中可能“溢出”到外部。例如：

function example() { if (true) { var a = 10; // 变量 a 属于整个函数作用域 } console.log(a); // 输出 10（正常访问） }

1.2 变量提升（Hoisting）

var 声明的变量在代码执行前会被提升到当前作用域的顶部，但赋值操作留在原地。这可能导致“提前访问但值为 undefined”的问题，容易引发难以调试的 bug。例如：

console.log(age); // 输出 undefined（不会报错） var age = 18; // 变量提升，但赋值留在原地

1.3 允许重复声明

var 允许在同一作用域内重复声明同名变量，后续声明会覆盖前面的声明。例如：

var x = 5; var x = 6; // 合法，x 的值被覆盖为 6

二、let：ES6 引入的块级作用域变量声明方式

2.1 let 的基本特性

let 声明的变量具有块级作用域，仅在当前块（如 {}、if、for 等）内有效。这解决了 var 作用域混乱的问题。例如：

if (true) { let y = 20; // 变量 y 仅在当前块内有效 } console.log(y); // 报错：y 未定义

2.2 暂时性死区（Temporal Dead Zone）

let 变量在声明前不可访问，即存在“暂时性死区”。这避免了变量提升带来的问题。例如：

console.log(c); // 报错：Cannot access 'c' before initialization let c = 30; // 变量 c 在声明前处于“死区”

2.3 禁止重复声明

let 不允许在同一块级作用域内重复声明同名变量。例如：

let z = 5; let z = 6; // 报错：Identifier 'z' has already been declared

2.4 循环中的正确使用

在 for 循环中使用 let 时，每次迭代都会绑定一个新变量，避免了变量提升带来的问题。例如：

for (let i = 0; i < 3; i++) { setTimeout(() => console.log(i), 0); // 输出 0、1、2（正确） }

三、const：ES6 引入的常量声明方式

3.1 const 的基本特性

const 用于声明常量，其值一旦初始化后就不能被重新赋值（但对象或数组的属性可以修改）。例如：

const PI = 3.1415926; PI = 3.14; // 报错：Assignment to constant variable

3.2 块级作用域

const 声明的变量也具有块级作用域，仅在当前块内有效。例如：

if (true) { const NAME = '张三'; } console.log(NAME); // 报错：NAME 未定义

3.3 必须初始化

const 变量必须在声明时初始化，否则会报错。例如：

const NAME; // 报错：Missing initializer in const declaration

3.4 对象/数组的修改

虽然 const 不能重新赋值整个对象或数组，但可以修改其属性或内容。例如：

const person = { name: '张三', age: 28 }; person.name = '李四'; // 允许 console.log(person); // 输出 { name: '李四', age: 28 } person = {}; // 报错：Assignment to constant variable

四、var、let 和 const 的核心区别对比

特性	var	let	const
作用域	函数作用域	块级作用域	块级作用域
变量提升	是	否（暂时性死区）	否（暂时性死区）
重复声明	允许	不允许	不允许
重新赋值	允许	允许	不允许（对象属性可修改）
必须初始化	否	否	是
全局污染	是（成为全局对象属性）	否（除非在全局作用域中声明）	否（除非在全局作用域中声明）

五、最佳实践

1. 优先使用 const：在声明常量时，优先使用 const，因为它能确保值不被意外修改。

2. 其次使用 let：在需要重新赋值的变量上使用 let。

3. 避免使用 var：由于 var 的变量提升和作用域问题，建议在现代项目中避免使用它。

4. 注意暂时性死区：在使用 let 和 const 时，要注意它们的暂时性死区特性，避免在声明前访问变量。

通过本文的介绍，您应该能够清晰地理解 var、let 和 const 的区别与用法，并在实际开发中正确选择使用它们。在 JavaScript 编程中，合理地使用这些变量声明方式，能够提高代码的可读性、可维护性和安全性。