提醒:由於看到這系列鐵人訂閱人數漸漸變多,標記一下這些內容是在「非常萌新時期」所寫,更多技術內容請參考我的 Github,歡迎跟我一起討論 ^ ^
今天就來談談昨天提到的建議以 const/let 取代 var 的原因吧
首先先來簡單介紹一下JS的 Hoisting 特性,JS中,宣告變數 var
、建立函式 function () {...}
,會被提到最前面先執行。
想像成看電影前,只先看了演員名單,提前知道有哪些演員,但他們可能在電影中段才出現,而你已經知道該演員會出現在這部電影。
console.log(a)
結果:a is not defined(a 這個變數不存在)
console.log(a)
var a
結果:undefined(存在 a 這個變數,但他是未定義的變數)
也就是說,在第2例中 var a
雖然寫在後面,但他會被提到最前面先執行,所以 a 已經被宣告了,這就是Hoisting的結果。
更深入內容可參考這篇
可以想像成在每個 scope 中,擁有他各自獨立的變數,而JS在查找變數時,會先在當前的 scope 中查詢,若無該變數,再往其上一層 scope 查找。
舉例:
var a = 1
var b = 3
function f(){
var b = 2
console.log(a+b)
}
f()
其中,在 function f( ) 中,有變數b,則取得變數b為2,而其中無變數a,則往上一層找到變數a,則取得變數a為1,因此結果a+b為3。
{...}
內的範圍。