2015年12月9日

[筆記] 談談Javascript 中的 Hoisting


今天來談談javascript裡面hoisting的這個概念(若有錯誤再麻煩指正),讓我們先來看一段程式碼:


一般在寫程式的時候,我們都會定義好變項,然後才去使用它,如果在尚未定義的情況下,直接去使用這個變項,通常都會出現錯誤訊息!

然而,在javascript中有一個蠻特別的概念是hoisting,在w3schools中是這樣描述hoisting的:
Hoisting is JavaScript's default behavior of moving declarations to the top.

指的是在JavaScript中,它會把定義的變項移到最前面先執行。

所以執行這段程式後,會有如下結果:


結果當中並沒有出現任何的錯誤!因為它其實在程式一開始執行的時候,就已經把var afunction b(){....}這些宣告(declare)的變項都存在記憶體中了,但是還沒把值指定進去a這個變項當中,這使得a得到了undefined的結果(注:undefined在JavaScript並不是真正的undefined,它其實也是一個值(value),而且是一個特殊值。可進一步參考這篇:[筆記] JavaScript: undefined不是真的undefined !!)。

更精確的說,在我們定義變項的過程中,可以分成宣告(declaration)和給值(initialization)的兩個過程,只有declaration的內容會在逐行執行程式前先被執行並儲存在記憶體中(hoisted);給值的內容則是在hoisted後,逐行執行程式時,才會被執行到。

w3schools中是這樣說明的:
JavaScript Declarations are Hoisted
JavaScript Initializations are Not Hoisted

如果我們把上面的程式,作如下的修改,把定義a的過程刪除:


這時候結果就會出現error:


因為a並沒有被宣告過,所以出現錯誤訊息,這裡回應到上面所提到的,在JavaScript中undefined和not defined是不一樣的undefined其實是一個值,not defined則是沒有定義過這個變項。


→回到此系列文章目錄

參考資料

W3Schools --- JavaScript Hoisting

0 意見:

張貼留言