文章目錄
- JavaScript 中 var、let、const 的差異
- 1. 作用域（Scope）
- 2. 變量提升（Hoisting）
- 3. 重復聲明
- 4. 變量值是否可變
- 對比表
- 5. 示例代碼
- 總結
JavaScript 中 var、let、const 的差異
1. 作用域（Scope）
-
var
- 函數作用域（function scope）
- 在函數內部用 var 聲明的變量，只在函數內部可見。
- 在塊
{}中聲明的 var，會“泄露”到外層。
-
let / const
- 塊級作用域（block scope）
- 在
{}內聲明，只在這個塊內有效（如 if、for、while 塊）。
2. 變量提升（Hoisting）
-
var
- 會被提升（hoisting）到作用域頂端，聲明提前，但賦值不提前。
- 使用前變量值是
undefined。
-
let / const
- 也會提升，但存在 暫時性死區（TDZ，Temporal Dead Zone）。
- 在聲明之前訪問會報錯。
3. 重復聲明
-
var
- 在同一作用域中可以重復聲明，不會報錯（但會覆蓋）。
-
let / const
- 在同一作用域中不能重復聲明，否則報錯。
4. 變量值是否可變
-
var / let
- 都可以重新賦值。
-
const
- 聲明后必須立即賦值，且不能重新賦值。
- 注意：如果 const 指向對象/數組，內部屬性仍然可以修改。
對比表
| 特性 | var | let | const |
|---|---|---|---|
| 作用域 | 函數作用域 | 塊級作用域 | 塊級作用域 |
| 變量提升 | 有，值為 undefined | 有，但存在暫時性死區 | 有，但存在暫時性死區 |
| 重復聲明 | 允許 | 不允許 | 不允許 |
| 是否必須賦初值 | 否 | 否 | 是 |
| 是否可重新賦值 | 可以 | 可以 | 不可以（引用可變） |
5. 示例代碼
// var 演示
if (true) {var a = 10;
}
console.log(a); // 10 （變量泄露出塊作用域）// let 演示
if (true) {let b = 20;
}
// console.log(b); // 報錯：b is not defined// const 演示
const PI = 3.14;
// PI = 3.14159; // 報錯：Assignment to constant variableconst obj = { name: "Tom" };
obj.name = "Jerry"; // ? 可以修改對象屬性
console.log(obj.name); // Jerry
總結
var：老語法，函數作用域，會變量提升。let：推薦，塊級作用域，可重新賦值。const：推薦，塊級作用域，聲明常量，引用不可變。
