写代码的时候,变量声明看起来是最基础的操作,但偏偏就是这个环节,很多人一不留神就掉进坑里。尤其是刚入门的新手,有时候程序跑不起来,查了半天才发现是变量声明出了问题。
1. 忘记声明直接使用
最常见的错误之一就是直接用一个变量,却忘了先声明。比如在 JavaScript 中:
count = 10;
console.log(count);
虽然这段代码在非严格模式下能运行,但会自动创建全局变量,污染作用域。正确的做法是加上 let 或 const:
let count = 10;
console.log(count);
2. 变量提升带来的迷惑
JavaScript 有变量提升机制,但很多人没搞明白,结果代码执行顺序和预期不一样。
console.log(name);
var name = "小明";
你以为会报错?其实输出的是 undefined,因为 var 声明被提升了,但赋值还在原地。换成 let 就不一样了:
console.log(name);
let name = "小明";
这回直接报错:Cannot access 'name' before initialization。所以推荐多用 let 和 const,避免意外。
3. 作用域搞混了
在循环里用 var 声明变量,经常出问题。比如:
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
你以为输出 0、1、2?实际输出三次 3。因为 var 是函数作用域,所有回调都共享同一个 i。改成 let 就解决了:
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
let 每次迭代都会创建新绑定,输出就正常了。
4. 同名变量重复声明
用 var 可以重复声明同一个变量,不会报错:
var user = "张三";
var user = "李四"; // 不报错
但用 let 就不行:
let user = "张三";
let user = "李四"; // 报错:Identifier 'user' has already been declared
这其实是好事,避免了不小心覆盖变量。
5. 声明了不用,或者用了没声明
有时候写完一段逻辑,回头一看,某个变量压根没被调用,白白占着内存。或者更糟,拼错了变量名:
let userName = "王五";
console.log(username); // 报错:username is not defined
大小写、拼写差一点,程序就崩了。开发时最好配合 ESLint 这类工具,提前发现问题。
6. 全局变量滥用
有些人图省事,把所有变量都往全局一扔:
userName = "赵六";
age = 25;
看起来没问题,但多个脚本之间容易冲突。比如两个页面都用了 temp 这个变量名,谁覆盖谁都不好说。尽量用模块化方式管理变量,减少全局污染。
变量声明虽小,影响却不小。一个小疏忽可能让调试花上大半天。养成规范的声明习惯,比事后排查高效得多。