JavaScript变量提升与暂时性死区测试题：var/let/const在函数中的作用

请观察以下函数代码，推导调用 test(10) 后的控制台输出：

function test(a) {
  console.log("第 1 处输出:", a);
  var a = 20;
  function a() {}
  console.log("第 2 处输出:", a);
}
test(10);

// 第 1 处输出: [Function: a]
// 第 2 处输出: 20

逐行推导与原理分析：

1. 进入执行上下文创建阶段：
   首先，处理形参 a = 10，在变量环境中建立绑定并赋值 10。
   其次，扫描函数声明 function a() {}。函数声明具有高优先级，由于名称同为 a，函数声明会直接覆盖之前的形参赋值，此时 a 指向该函数对象。
   最后，扫描 var a = 20。因为变量环境中已经存在标识符 a，var a 的声明部分被直接忽略（不会重置为 undefined）。
2. 进入代码执行阶段：
   执行第 2 行：此时 a 仍然是创建阶段确立的函数对象，因此第一处打印 [Function: a]。
   执行第 3 行：a = 20 执行赋值表达式，变量 a 被重新赋予数值 20。
   执行第 4 行：function a() {} 属于函数声明，已在创建阶段处理完毕，执行阶段直接跳过。
   执行第 5 行：输出此时的数值 20。

请判断以下两个案例的执行结果：

// 案例 A：作用域遮蔽引发的 TDZ
let x = "outer";
function checkShadow() {
  console.log(x);
  let x = "inner";
}
checkShadow();

// 案例 B：函数默认参数互相引用
function checkParams(a = b, b = 2) {
  return a + b;
}
checkParams();

// 案例 A 输出:
// ReferenceError: Cannot access 'x' before initialization

// 案例 B 输出:
// ReferenceError: Cannot access 'b' before initialization

逐行推导与原理分析：

案例 A 分析：初学者常误以为由于外层存在 let x = "outer"，内部第一句会输出 "outer"。然而，在 checkShadow 函数被调用时，其内部作用域在创建阶段就已检测到 let x = "inner"，并在局部词法环境中登记了 x 的绑定。根据 JavaScript 词法作用域检索规则，当前作用域只要存在该标识符，解析立即锁定当前作用域，不会向外层回溯。由于执行尚未到达赋值行，局部 x 位于 TDZ 内，读取操作直接抛出 ReferenceError。

案例 B 分析：函数的形参列表拥有属于自己的独立参数作用域。参数求值是严格从左到右依次进行的。当计算 a = b 时，变量 b 虽然已在参数作用域中登记，但尚未执行到 b = 2 的初始化阶段，因此 b 处于参数 TDZ 中，访问引发 ReferenceError。

请推导以下函数在传入不同参数时的执行逻辑：

function conditionScope(flag) {
  console.log("块前访问:", num);
  if (flag) {
    var num = 100;
    let blockVal = 200;
  }
  console.log("块后访问 num:", num);
  console.log("块后访问 blockVal:", typeof blockVal);
}
conditionScope(false);

// 块前访问: undefined
// 块后访问 num: undefined
// 块后访问 blockVal: undefined

逐行推导与原理分析：

1. var num 没有块级作用域概念，它会被提升到包裹它的整个函数 conditionScope 作用域顶部，并初始化为 undefined。因此，即使代码在 if 分支之前，或者 if 条件为 false 根本不执行，num 依然存在于函数环境中，值为 undefined。
2. let blockVal 严格遵循 if (flag) { ... } 建立的块级作用域。当 flag 为 false 时，该块级环境甚至没有被激活；即便条件为 true，该变量也在块执行结束后立即销毁。在块外部执行 typeof blockVal 时，由于外界从未声明过该变量，返回 "undefined"，不会报错。

请推导以下分别使用 var 和 let 的循环函数数组执行结果：

// 循环 A：使用 var
var listA = [];
for (var i = 0; i < 3; i++) {
  listA.push(function() { return i; });
}
console.log(listA[0](), listA[1](), listA[2]());

// 循环 B：使用 let
var listB = [];
for (let j = 0; j < 3; j++) {
  listB.push(function() { return j; });
}
console.log(listB[0](), listB[1](), listB[2]());

// 循环 A 输出: 3 3 3
// 循环 B 输出: 0 1 2

逐行推导与原理分析：

在循环 A 中，var i 是外层作用域中的同一个全局/函数变量。在循环的 3 次迭代中，所有推入 listA 的闭包函数都保持着对同一个变量 i 的引用。循环终止时，i 的最终状态为 3。当外部主动调用这些函数时，它们都从同一内存槽中读取数据，因而全为 3。

在循环 B 中，ECMAScript 规范对 for (let ...) 做了专门的设计：每一次迭代都会生成一个全新的块级词法环境。在进入下一轮迭代时，引擎会把上一轮迭代结束时的值作为初始值复制到新的块级环境中。因此，每个闭包函数各自捕获并锁定了属于自己轮次的 j 实例（分别是 0、1、2），最终输出符合直觉的递增数字。

1. 首选 const，次选 let，完全禁用 var：利用块级作用域限制变量生命周期，借助 TDZ 机制在编码早期暴露未初始化引用的逻辑错误。
2. 变量在作用域顶部集中声明：尽量在使用变量前完成初始化，避免依赖提升行为。
3. 默认参数保持独立：避免后方默认参数依赖前方未确认的参数，避免复杂的参数互引。