二、“预解析”解释

考虑下面的代码：

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的下面啊，照理说应该不会有影响啊，是吗？还是？

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

在当前的作用域内，无论在哪里变量声明，在幕后，其都在顶部被“预解析”了。不过，仅声明被“预解析”。该变量即使初始化，其当前的值，在作用域的顶部，也会被设置成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  // 最后一行脚本 })();

四、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一些运行机制，本身资质也有限，所以文章可能有翻译或是表述不准确的地方，还望不遗余力的指正，不甚感谢。

原创文章，转载请注明来自[]