JavaScript 變數宣告 var, let, const 比較

JavaScript 變數宣告 var, let, const 比較

更新於 發佈於 閱讀時間約 2 分鐘

JavaScript在ES6新增了let, const等宣告變數的方式,其中let, const是block scope的,而var則是function scope:

console:

raw-image

有發現了嗎,test1用var來宣告,且宣告在if block裡面,但是在外面可以存取的到,test2用let來宣告,在外面則存取不到!

接下來看看const:

console:

raw-image

const是用來宣告不會再改變的常數,因此才會報錯。

總結:

  1. 在開發過程中應該要盡量讓變數scope最小化,避免在大型專案裏面變數互相影響等問題。
  2. 在後續不需要再改變的變數,宣告成const會比較好,避免這個value在其它地方被修改。

#note IE11以下不支援let語法,IE11可以:

從console可以看到模擬成IE10,但會出現必須有;的錯誤訊息,但是其實它是因為看不懂第9行的let,我試過改成var就過了。

raw-image

解決方法:

使用babel來解決,如以下line 5, 6.

其實babel只是幫忙把ES6語法轉成ES5, 讓瀏覽器可以看得懂!

console:

raw-image

可以看到看的懂let語法了,但出現一行warning,意思應該是建議要上production的話要precompile速度會比較快吧! 有時間再來研究怎麼build.

avatar-img
Vic Lin的沙龍
21會員
161內容數
留言
avatar-img
留言分享你的想法!
Vic Lin的沙龍 的其他內容
promise是ES6才有的,它是一種非同步的技術,使用它除了可以在background處理一些事情以外,還可以增加程式碼的可維護性。
promise是ES6才有的,它是一種非同步的技術,使用它除了可以在background處理一些事情以外,還可以增加程式碼的可維護性。