红宝书第二讲:JavaScript变量声明:var
、let
、const
详解
资料取自《JavaScript高级程序设计(第5版)》。 查看所有教程:红宝书学习大纲
一、var
:旧时代的变量声明
-
函数作用域
-
var
声明的变量属于整个函数 ,在块(如{}
、if
、for
)中可能"溢出"到外部:javascriptfunction example() { if (true) { var a = 10; // 变量a属于整个函数作用域 } console.log(a); // 输出10(正常访问)[^3] }
-
-
允许重复声明
-
同名变量重复声明不会报错(容易导致意外覆盖):
javascriptvar x = 5; var x = 6; // 合法,x的值被覆盖为6[^3]
-
-
变量提升(Hoisting)
-
var
变量在代码执行前会被提升到作用域顶部:javascriptconsole.log(b); // 输出undefined(不会报错) var b = 100; // 变量提升,但赋值留在原地
-
二、let
:块级作用域的救星
-
块级作用域
-
let
声明的变量仅在当前块(如{}
、if
、for
)内有效 :javascriptif (true) { let y = 20; } console.log(y); // 报错:y未定义[^3][^2]
-
-
禁止重复声明
-
同一个块中不可重复声明同名变量:
javascriptlet z = 5; let z = 6; // 报错:Identifier 'z' already declared[^3]
-
-
暂时性死区(Temporal Dead Zone)
-
let
变量在声明前不可访问:javascriptconsole.log(c); // 报错:Cannot access 'c'... let c = 30; // 变量c在声明前处于"死区"[^4]
-
-
循环中的正确使用
-
for
循环中使用let
每次迭代绑定新变量,避免错误:javascriptfor (let i = 0; i < 3; i++) { setTimeout(() => console.log(i), 0); // 输出0、1、2(正确)[^2][^6] }
-
三、const
:声明常量的利器
-
必须初始化
-
const
声明时必须赋值,否则报错:javascriptconst PI = 3.14; // 正确 const ERROR; // 报错:必须初始化[^4]
-
-
不可重新赋值(但可修改内部属性)
-
对于简单类型(如数字、字符串),值不可变:
javascriptconst URL = "http://example.com"; URL = "http://new.com"; // 报错:Assignment to constant variable[^4]
-
对于对象或数组,属性或元素可以修改:
javascriptconst user = { name: "小明" }; user.name = "小红"; // 合法(对象属性可变)[^4]
-
-
块级作用域
-
const
和let
一样仅在块作用域内有效:javascript{ const KEY = "secret"; } console.log(KEY); // 报错:未定义[^4]
-
四、最佳实践
-
避免使用
var
let
和const
更安全、更清晰(ES6后推荐使用)^1^
-
优先使用
const
- 默认用
const
声明,确认需要重新赋值时改用let
^1^
- 默认用
-
多变量声明技巧
-
用逗号分隔多个变量,减少冗余代码:
javascript// 一次声明多个变量(更高效) let name = "小明", age = 20, score = 95;[^1]
-
目录:总目录 上篇文章:第一讲:JavaScript 语法与数据类型详解
Footnotes
const
适用场景,《JavaScript高级程序设计(第5版)》 第3章 ↩ ↩2