## JS預編譯 > JS執行前會進行預編譯 - 全局預編譯GO(Global Object) - 函數預編譯AO (Activation Object) ``` var a function fun() { } function abc() { } function a() { } console.log(a); var a = 100; console.log(a); ``` - 會生成一個對象（GO），這個對象封裝的就是作用域，稱為GO（global object）。當全部掛載完成之后，然后代碼在去逐行執行 ``` GO = {} ``` - 分析變量聲明（var）——變量作為GO對象的屬性名，值為undefined ``` GO = { a: undefined } ``` - 分析函數聲明（function）——函數名作為GO對象的屬性名，值為函數體（如果遇到同名，直接覆蓋） ``` GO = { a: undefined, fun: function fun(){}, abc: function abc(){} } ``` - 當走到某一行的時候；a產生了一次賦值；此時GO對象變成了： ``` GO = { a: 100, fun: function fun(){} abc: function abc(){} } ``` - 逐行執行（看著GO對象里面的執行） ***** > **AO：是函數執行前的一瞬間，生成一個AO對象（在函數執行前的一瞬間會生成自己的AO，如果函數執行2次，生成了兩次AO，這兩次的AO是沒有任何關聯）** ``` var num = 100 function fun(num, age) { console.info(age) var age = 15 console.info(age) console.log(num) function ohter() {} } fun(5, 12) ``` - 執行前的一瞬間，會生成一個AO（action object）對象 ``` AO = {} ``` - 將函數內的形參和變量聲明存儲到AO對象中，值為undefined ``` AO = { num: undefined, age: undefined } ``` - 將實參和形參統一，形參作為AO對象的屬性名，實參作為AO對象的屬性值 ``` AO = { num: 100, age: 12 } ``` - 分析函數聲明，函數名作為AO對象的屬性名，值為函數體，如果遇到同名的，直接覆蓋 ``` AO = { num: 100, age: 12, ohter: function() {} } ``` - 整體執行過程 ``` // step - 1 GO = {} // step - 2 GO = { num: undefined } // step - 3 GO = { num: undefined, fun: function((num, age) { console.info(age) var age = 12 console.log(num) function ohter() {} } } // 逐行執行（賦值） step - 4 GO = { num: 100, fun: function((num, age) { console.info(age) var age = 12 console.log(num) function ohter() {} } } // 執行函數 step - 5 AO = {} // step - 6 AO = { num: undefined, age: undefined } // step - 7 AO = { num: 100, age: 12 } // step - 8 AO = { num: 100, age: 12, ohter: function() {} } // 執行console.info(age) step - 9 12 // 執行賦值 step - 10 AO = { num: 100, age: 15, ohter: function() {} } // 執行console.info(age) step - 11 15 // 執行console.info(num) step - 12 5 ```