为何可在if语句块内重声明与函数参数同名的变量？

这是因为JavaScript的**变量遮蔽（Variable Shadowing）**规则，而非重声明。

核心区别：作用域层级 #

函数参数value属于函数作用域，而if语句块是嵌套在函数作用域内的块级作用域。当你在块级作用域里用const/let声明同名变量时，并不是在同一个作用域里重声明，而是创建了一个新的、仅属于当前块的变量——这个新变量会"遮蔽"外部函数作用域的同名参数，两者是完全独立的变量。

重声明的触发条件 #

MDN提到的"同一函数或块级作用域内重声明不允许"，指的是同一个作用域层级内的重复声明。比如直接在函数作用域里加let value = ...，就会和参数value处于同一作用域，触发重声明错误；但在嵌套的块级作用域里声明，属于不同的作用域层级，完全合法。

代码验证 #

看这个简化示例：

function CSS(prop, value) {
  console.log('外部参数value:', value); // 输出传入的undefined
  if (value === undefined) {
    const value = 'block-scoped';
    console.log('块内value:', value); // 输出block-scoped，遮蔽了外部参数
  }
  console.log('外部参数value仍为:', value); // 还是undefined，说明内部变量不影响外部
}

CSS('color', undefined);

总结 #

• 嵌套作用域可以声明同名变量，通过遮蔽隐藏外部同名变量，这是JavaScript的正常行为。
• 只有在同一作用域内，用let/const重复声明同名变量才会报错。

内容的提问来源于stack exchange，提问作者GHOST-34