B014-变量提升

下面的代码会在 console 输出神马？为什么？

(function(){
  var a = b = 3;
})();
console.log("a defined? " + (typeof a !== 'undefined'));   
console.log("b defined? " + (typeof b !== 'undefined'));

这跟变量作用域有关，输出换成下面的：

console.log(b); //3
console,log(typeof a); //undefined

拆解一下自执行函数中的变量赋值：

b = 3;
var a = b;

所以 b 成了全局变量，而 a 是自执行函数的一个局部变量。

解析：

这段代码的输出结果是：

a defined? false
b defined? true

让我来解释一下为什么：

1. 这段代码使用了立即执行函数表达式(IIFE)来创建一个独立的作用域。

2. 在函数内部，var a = b = 3; 这行代码实际上被JavaScript解释为：

   var a = (b = 3);
   

   或者更准确地说：

   var a;
   a = b = 3;
   

3. 这里关键点是变量声明提升和赋值操作的区别：

   • a 使用 var 声明，所以它被限制在函数作用域内
   • b 没有使用 var 声明，所以它会变成全局变量

4. 函数执行完毕后，a 由于是函数作用域内的变量，在函数外部无法访问，所以 typeof a 返回 'undefined'

5. 而 b 被赋值为全局变量，所以 typeof b 返回 'number'，不为 'undefined'

这种代码风格可能会引起混淆，建议明确声明变量作用域，改为：

(function(){
  var a = 3;
  var b = 3;
})();

这样可以更清晰地表明两个变量都是函数作用域内的局部变量。