预解析：var散布的问题

2、“预解析”解释

考虑下面的代码：

var myvar = 'my value';
alert(myvar); // my value

Okay, 固然，弹出的结果确定是"my value"，可是，跟着我，让我下面建立个方法，弹出相同的值：

var myvar = 'my value';

(function() {
  alert(myvar); // my value })();

好吧，好吧，仍然很明显，我知道。如今，让咱们加点猛的调料，在匿名函数内部建立一个同名的局部变量。

var myvar = 'my value';

(function() {
  alert(myvar); // undefined   var myvar = 'local value';
})();

哈啊？为何弹出的是undefined呢？即便咱们声明了一个新的变量，可是它在alert的下面啊，照理说应该不会有影响啊，是吗？仍是？

3、变量声明被“预解析”

在当前的做用域内，不管在哪里变量声明，在幕后，其都在顶部被“预解析”了。不过，仅声明被“预解析”。该变量即便初始化，其当前的值，在做用域的顶部，也会被设置成undefined。

恩，如今让咱们好好的破译下这个“声明”和“初始化”，以var joe = 'plumber';为模特吧。

声明(Declaration)

var joe; // the declaration

初始化(Initialization)

joe = 'plumber'; // the initialization 

如今，咱们知道了这些术语的意思，就能够更好的理解到底背地里都干了些什么勾当，请看下面的伪函数：

(function() {
  var a = 'a';
  // 一行代码   var b = 'b';
  // 更多行的代码   var c= 'c'; // antipattern   // 最后一行脚本 })();

需注意，上面的这作法是不太好的。可是，先无论这个，在程序的背后，这个变量声明不管在函数做用域的什么地方，都被置顶解析了，就像下面这样：

(function() {
  var a, b, c; // variables declared
  a = 'a';
  // 一行代码   b = 'b'; // initialized
  // 更多行的代码   c= 'c'; // initialized
  // 最后一行脚本 })();

4、soga！

如今回到使人疑惑的undefined代码段

var myvar = 'my value';

(function() {
  alert(myvar); // undefined  
  var myvar = 'local value';
})();

如今应该比较容易理解为什么myvar弹出的是undefined了。正如上面学到了，当咱们声明myvar变量的时候，其自动的在函数做用域的顶部（在alert的前面）进行“解析”了。结果，在alert的时候时的变量尚未被声明。然而，因为初始化的值是不会做用域置顶的，因此，最后alert的值是undefined。

//zxx:以上为翻译全文

译者补充：

上面弹出undefined的代码实际上就等效于下面的代码：

var myvar = 'my value';

(function() {
  var myvar;
  alert(myvar); // undefined   
  myvar = 'local value';
})();

JavaScript的预解析不只适用于变量，彷佛也适用于函数，你有兴趣能够看下下面这个例子：

g = function() { return false; };
(function() {
    if(g()) {
        function g() { return true; }
        alert("in"); //IE6~8，Chrome，Safari，Opera浏览器执行     }
})();

在非Firefox浏览器下，会弹出字符串"in"的，固然，这里的重点不是哪一个浏览器执不执行，因此不考虑Firefox的问题，function g() { return true; }含函数做用域顶部（在if的前面）“预解析”，因此，if语句能够执行。

本文涉及到JavaScript一些运行机制，自己资质也有限，因此文章可能有翻译或是表述不许确的地方，还望竭尽全力的指正，不甚感谢。

原创文章，转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址：http://www.zhangxinxu.com/wordpress/?p=1162