JavaScript中let和var能否重复声明及全局挂载差异

一、能否重复声明：解析时机与执行结果对比

在同一个作用域范围内，处理重名变量的方式直接反映了 ES5 与 ES6+ 在设计严谨性上的不同定位。

1. var 的重复声明与静默覆盖

使用 var 多次声明同一个变量名是合法的。JavaScript 引擎在预编译（创建执行上下文）阶段会收集所有变量声明，如果发现当前作用域中已经存在同名变量，后续的 var 声明关键字会被引擎自动忽略，仅保留后续的赋值操作：

// var 允许在同一作用域内重复声明
var user = "Alice";
var user = "Bob"; // 语法合法，声明被合并，仅执行赋值

console.log(user); // 输出: Bob

这种机制虽然不会报错，但在多人协作或长函数逻辑中极易引起“变量意外被同名声明覆盖”的隐蔽缺陷。

2. let 的严格禁止与编译期报错（Early Error）

为了从语言层面杜绝此类逻辑漏洞，ES6 引入的 let 明确规定：在同一作用域内，不允许重复声明已存在的标识符。无论先声明的是 var、let 还是 const，只要同一层级中存在同名 let，JavaScript 引擎在语法分析（Parsing）阶段就会立即中断并抛出 SyntaxError：

let score = 90;
let score = 95;
// Uncaught SyntaxError: Identifier 'score' has already been declared

// 混合声明同样报错
var total = 100;
let total = 200;
// Uncaught SyntaxError: Identifier 'total' has already been declared

3. 嵌套块级作用域下的“变量遮蔽”（Shadowing）

需要特别区分“同作用域重复声明”与“嵌套作用域变量遮蔽”：如果是在不同的块级作用域（如 {} 代码块内部），内部使用 let 声明一个与外部同名的变量是完全合法的。此时内部变量与外部变量互不干扰，离开块级作用域后外部变量依然有效：

let count = 10; // 外层全局/父级块

if (true) {
  let count = 20; // 合法：位于独立子块级作用域，遮蔽外层 count
  console.log("块内部:", count); // 输出: 20
}

console.log("块外部:", count); // 输出: 10，外层变量未被破坏

二、全局挂载差异：全局对象与词法环境架构

在浏览器主线程的非模块化顶层代码（Global Scope）中声明变量时，var 与 let 产生的数据存储位置截然不同。

1. 全局挂载现象

在全局代码中执行以下声明：

// 全局上下文顶层
var globalVar = "我是var";
let globalLet = "我是let";

// 1. 通过直接访问标识符
console.log(globalVar); // 输出: "我是var"
console.log(globalLet); // 输出: "我是let"

// 2. 检查浏览器全局对象 window (或 globalThis)
console.log(window.globalVar); // 输出: "我是var" (挂载成功)
console.log(window.globalLet); // 输出: undefined (未挂载!)

// 3. 检查属性从属与配置
console.log("globalVar" in window); // true
console.log("globalLet" in window); // false

可以看到，var globalVar 成为了 window 的属性；而 let globalLet 虽然同样是全局可访问的有效变量，但在 window 上却完全找不到。

2. ECMAScript 规范层面的存储架构解释

为什么 let 既可以在全局被读取，又不在 window 上？这源于 ECMAScript 规范中对全局环境记录（Global Environment Record）的复合构造。

全局环境记录包含两个相互独立的基础记录组件：

• 对象环境记录（Object Environment Record）：直接与全局宿主对象（如浏览器的 window）进行双向绑定。顶层的 var 声明和函数声明（FunctionDeclaration）都记录在此处。向 window 上添加属性相当于在这里添加变量，反之使用 var 声明也直接表现为 window 上的属性。
• 声明式环境记录（Declarative Environment Record）：一个纯粹的词法存储结构，直接保存标识符与绑定值，不对应任何可见的 JavaScript 对象。顶层的 let、const 和 class 均记录在此处。

当代码访问一个无前缀的标识符（例如 console.log(x)）时，解析器的查找优先级是：先在声明式环境记录中查找，若未命中，再去对象环境记录中查找。因此 let 变量能被全局正常识别，同时又隔离于 window 之外，避免了无意中篡改如 window.name、window.location 等原生 API 的隐患。

三、综合对比：重复声明与全局挂载的协同影响

为了直观掌握两者在代码运行生命周期中的差别，下表汇总了变量声明在不同维度的具体表现：

四、常见易错场景与排查定位

1. switch 语句中的重复声明报错

很多初学者在编写 switch-case 时经常遇到意料之外的 SyntaxError：

// 错误示例：整个 switch 处于同一个块级作用域中
switch (status) {
  case 1:
    let message = "处理中";
    break;
  case 2:
    let message = "已完成"; // 报错：Identifier 'message' has already been declared
    break;
}

原因与解法：整个 switch { ... } 花括号属于同一个作用域，不同的 case 分支并没有独立的作用域空间。要在每个 case 下使用独立的 let，只需为该分支添加显式的代码块花括号：

// 正确修复：为各分支创建独立的子作用域
switch (status) {
  case 1: {
    let message = "处理中";
    console.log(message);
    break;
  }
  case 2: {
    let message = "已完成"; // 正确！处于独立块中
    console.log(message);
    break;
  }
}

2. 为什么 window.someVar 总是 undefined？

当开发者希望在控制台或者外部挂载脚本中检查变量，习惯性输入 window.myConfig 时发现返回 undefined，容易误判为“变量没有成功加载”。

排查路径如下：

1. 直接在控制台输入无前缀的 myConfig：如果可以输出内容，说明该变量是用 let、const 声明的顶层变量，或者是 ES Module 模块作用域内部的局部变量。
2. 如果确实需要挂载到全局供多脚本共享，必须显式赋值给 window：window.myConfig = ...，而不要依赖 var 的隐式全局挂载。

五、总结

理解 let 与 var 在重复声明和全局挂载上的差异，是编写健壮、可维护 JavaScript 程序的基石：

• 重复声明方面：var 容忍同作用域重复声明并自动覆盖；let 坚决禁止同作用域重复声明，在编译解析阶段就通过 SyntaxError 消除潜在命名冲突。
• 全局挂载方面：var 在顶层声明时直接写入对象环境记录，成为 window 的不可配置属性；let 写入独立的声明式环境记录，保证了变量在全局范围可直接调用，同时又彻底与 window 宿主对象隔离。

在现代前端与 Node.js 开发中，推荐始终使用 const（默认首选）与 let，彻底摒弃 var；若确需跨脚本暴露公共能力，应当通过 window.myModule = ... 或模块导入导出（ES Modules）进行明确的显式管理。