本篇文章主要給大家詳細分析了js的作用域、預解析機制以及相關程式碼分析，對此有興趣的朋友學習下吧。
雖然，ES6在我們工作上應用得越來越廣泛，但是還是很多專案保留著ES5的寫法，所以，今天，帶著大家重新鞏固下ES5下的作用域及預解析機制。
作用域：域，指的是一個空間、範圍、區域，作用指的是可以在域內進行讀寫操作。一個變數的作用域是程式原始碼中定義的這個變數的區域。
在ES5中，只存在全域和函數層級作用域，在ES6中，引入了區塊級作用域,js的預解析機制大概分為兩個過程：預解析和自上而下逐行解讀
預先解析:js解析器會先把var定義的變數、function、參數等一些東西存放進倉庫裡面(記憶體)。變數var在正式運行之前，都賦值為undefined,function函數在運行之前，就是整個函數塊
表達式=、 、-、*、/、 、- -、！ 、%.....number()、參數都可以賦值
遇到重名的，只留下一個，變數和函數重名，函數優先權高於變量，只留下函數
函數呼叫（函數是一個作用域，遇到作用域都會按照先進行預解析，然後逐行解讀的過程執行），先局部找參數，局部找不到就自下向上找（作用域鏈）
概念扯了一大段，估計初學者還是有點暈乎乎，老司機就可以提前下車了，接下來，咋們舉幾個小栗子，結合上面的理論，深入理解。
例1：
alert(a); //error: a is not defined a = 3;
#分析：
預解析
上面說過，預解析時只會把var 、 function 、參數等儲存起來，所以：
整個作用域沒有找到var function 參數
逐行解讀
預解析後，內存中存在a且被賦值了underfind整個變量，所有，程式碼執行過程中程式直接報錯。
例2：
alert(a); //undefined var a = 3;
#分析：
#預解析
上面說過，預解析時只會把var 、 function 、參數等儲存起來，所以：
執行到第二行時，a 的值是未定義。
逐行解讀
第一行：預解析後，記憶體中存在a且被賦值了underfined
例3：
alert(a); // function a (){ alert(4); }
var a = 1;
alert(a); // 1
function a (){ alert(2); }
alert(a); // 1
var a = 3;
alert(a); // 3
function a (){ alert(4); }
alert(a); // 3分析：
域解析
上面說過，預解析時只會把var 、 function 、參數等儲存起來，所以：
執行到第二行時，a 的值是未定義。
執行到第四行時，a 的值是函數本身，也就是function a(){alert(2);}。
執行到第六行時，a 的值還是第四行時的值，也就是function a(){alert(2);}，因為函數的優先權比變數高。
執行到第八行時，a 的值就變成了function a(){alert(4);} ,因為當兩個函數重名時，遵循程式碼從上往下執行。
逐行解讀
預解析完成之後，就是程式碼逐行執行了，
#第一行：會彈出function a(){alert(4);} ，因為預解析完成之後，被存進記憶體的a 的值就是function a(){alert(4);}
第二行：第二行裡有表達式，a 被賦了一個新的值1 表達式會改變變數的值。表達式可以改變預解析的值。
第三行：a現在被賦值為1，所有會彈出1
第四行：只是函數的聲明，並沒有用到表達式，而且也沒有函數的調用，所以不會改變a 的值。
第五行：因為a的值沒有變化，所以還是1
第六行：使用了表達式，a 被賦了一個新的值3
#第七行：會彈出3
第八行：函數的聲明，不會改變a 的值。
第九行：a的值沒有改變，所以還是3
#透過上面的栗子，相信大家應該對變數作用域的預解析過程有一定的了解了，接下來，咋們再舉幾個函數作用域的栗子
#例4：
var a=1;
function fn1(){
alert(a); //undefined
var a = 2;
}
fn1();
alert(a) //1例5：
var a=1;
function fn1(a){
alert(a); //1
var a = 2;
}
fn1(a);
alert(a) //1var a=1;
function fn1(a){
alert(a); //1
a = 2;
}
fn1(a);
alert(a) //1var a=1;
function fn1(){
alert(a); //1
a = 2;
}
fn1(a);
alert(a) //2以上是js的作用域、預解析機制（詳細教學）的詳細內容。更多資訊請關注PHP中文網其他相關文章！
