iT邦幫忙

第 11 屆 iT 邦幫忙鐵人賽

DAY 29
0
Modern Web

JS 學習歷程系列 第 29

工程師必懂英文單字 - Hoisiting (厚伊思停)

火箭隊賈斯汀教練曾說過,他很想出一本「工程師必懂英文單字指南」(笑),在他還沒找到出版社代理這本書之前,我們今天就先來聊聊 Hoisiting (必懂單字之一),如果有興趣的出版社,歡迎再與我聯絡(歪樓):

  1. 首先我們先來看 W3C 解釋 Hoisiting:

https://ithelp.ithome.com.tw/upload/images/20190930/20119922JDP3WHxu0D.jpg

  1. 我們來看看什麼叫什麼把宣告提升到最上面,讓我們先來印出一個 a 玩玩:

console.log(a);

果不其然的結果當然是錯誤訊息 ReferenceError: a is not defined (a 沒有被定義)
https://ithelp.ithome.com.tw/upload/images/20190930/20119922KCsyFcU98Y.png

  1. 接著我們在剛剛的 console 下面接著加個 var a = 5;

console.log(a);
var a = 5 ;

就我們的所知的 JS,在執行程式時是一行一行往下跑,在上面那段程式執行上,我們先印出了 a,接著才將 a 賦予一個 5,照理說,我們應該也會出現 ReferenceError 的錯誤訊息,但我們卻出現了 undefined (a 有被定義,但沒有值)的結果:
https://ithelp.ithome.com.tw/upload/images/20190930/20119922KYHPEwZkJs.png

  1. 鵝麥尬 ~ 這就是 Hoisiting ~ 在 JS 裡,宣告這件事被提升了,所以實際上的執行樣貌是這樣:

https://ithelp.ithome.com.tw/upload/images/20190930/20119922h7lAsU6hHt.jpg

  1. 除了 宣告 會被提升,function 也會被提升,下圖我們可以看到,我們先呼叫了 function,接著再執行 function,程式執行上不會有任何問題:

https://ithelp.ithome.com.tw/upload/images/20190930/20119922ygCnLMRkuY.png

好的,以上就是初淺 Hoisiting (厚伊思停) 分享,謝謝大家。


上一篇
我存進去了,我又取出來了! - localStorage 基本使用 (四)
下一篇
人生 DOM 不 DOM 都在競爭 - DOM 節點選擇
系列文
JS 學習歷程30

尚未有邦友留言

立即登入留言