JavaScript 聲明提前機制

標籤：運算式   範圍   fine   函數   興趣   www   存在   注意   解釋   

聲明提前機制

在JavaScript存在著這樣一種預先處理機制，即瀏覽器在解析JS代碼時會將var聲明的變數和function聲明的函數提升到當前範圍的頂部。但是解析JS代碼時對var和function關鍵字聲明的對象的處理是不一樣的：前者在解析時只是將聲明提前了，但是賦值卻依舊在原來的位置。而後者不僅將聲明提前了，而且將定義也完成。具體請看下面的例子：

1 console.log(hello);         //undefined2 sayHi();                    //hi3 4 var hello = "hello";5 console.log(hello);         //hello6 7 function sayHi() {8     console.log("hi");9 }

在第一行輸出一個在下面用var聲明並且賦值的hello變數，沒有報錯但是輸出的是undefined，說明hello變數的聲明確實是被提前了但是沒有賦值，所以輸出的是undefined。正是因為給變數賦值依舊在原來的位置，所以第五行輸出hello變數可以正常輸出。在處理function定義的sayHi函數時，sayHi的聲明被提前了，同時也對它進行了定義，所以在第二行調用sayHi時正常輸出hi而不是報 sayHi is not defined 或者sayHi is not a function的錯。

函式宣告優先於變數聲明

需要注意的是：函式宣告優先於變數聲明，看下面例子：

1 console.log(sayHi);         // ? sayHi() { console.log("hi"); }2 3 var sayHi = "sayHi";4 function sayHi() {5     console.log("hi");6 }7 8 console.log(sayHi);         // sayHi

先用var聲明變數sayHi並賦值為"sayHi"，然後用function再將sayHi重新聲明為一個函數。在聲明的前後輸出sayHi，發現前面輸出的是一個函數，後面輸出的是一個字串"sayHi"。顯然可以看出函式宣告是優先於變數聲明的。

這篇部落格正好也解釋了我之前寫的一篇函式宣告與函數運算式的區別，感興趣的可以去看一下。

JavaScript 聲明提前機制