JavaScript 核心觀念(7)-執行環境與作用域-提升Hoisting
嗨,大家好嗎? 我是Kris 今天要來分享一個我個人認為很有趣的觀念 以下截至 MDN 說明 提升(Hoisting)是在 ECMAScript® 2015 Language Specification 裡面找不到的專有名詞。它是一種釐清 JaveScript 在執行階段內文如何運行的思路(尤其是在創建和執行階段)。然而,提升一詞可能會引起誤解:例如,提升看起來是單純地將變數和函式宣告,移動到程式的區塊頂端,然而並非如此。變數和函數的宣告會在編譯階段就被放入記憶體,但實際位置和程式碼中完全一樣。 所以提升只是一個用來釐清JS如何運行的觀念,瞭解JS創造階段、執行階段做了什麼 對程式碼的結果又有什麼影響呢? 首先 JS在函式、變數宣告時,會先建立一個記憶體空間來存放他們的key&value,如下圖 var a = '1'; 在創造階段時建立a的儲存空間,但尚未賦予值,在執行階段時才會賦予值 所以可以將它看作這樣 ↓ //創造階段 var a; //執行階段 a = '1'; 函式陳述式在創造階段就會優先載入,並且將整個函式內容一起寫入 我們直接來看一個範例碼 * 函式比變數有更高的優先權 ,所以會比變數更優先被建立 * 所以,答案如下 console.log(myName); //小明 在創造階段時,myName尚未被賦予值,在那個時候會儲存的值為undefined。 是因為JS必須告訴我們它已準備好記憶體空間,若沒有給值會出現Error。 因此! 上面的範例程式碼,並不會進入if條件式! If裡的 myName 在創造階段時值為 undefined,故判斷式不會執行 後面 myName 又被賦予“小明”,所以myName 的值會印出小明 *if(myName) 是在判斷myName是否為 falsy值,是的話不會執行,否的話才執行 myName是falsy值,所以不會進入if(myName)的判斷式裡。 *常見 falsy值有 false、null、undefined、NaN、 0、 -0、""、'' *參考範例: https://developer.mozilla.org/zh-CN/docs/Glossary/Falsy 額外補充 一.!是一個NOT語句,會將結果反轉