JavaScript 核心觀念(59) - ES6 章節:Let 及 Const - Let, Const 基本概念
前言
接下來是一個全新的章節,從這個章節開始就會介紹 ES6 語法哦。
Let, Const 基本概念
ES6 語法簡單來講就是為了改善原本開發上的一些問題,所以也可以將 ES6語法當成一個語法糖,那麼什麼是語法糖呢?語法糖的意思是在講後來新增的某個語法,但是對於原本功能並沒有任何影響的一種說法而已,通常來講語法糖會比原本的語法更簡潔且更具有可讀性。
而 ES6 所出的 let
與 const
都是宣告變數使用的,與前面所使用的 var
相同,但是在實作上會有一點點不太一樣。
首先在原本的開發模式時,我們都知道變數會有提升的狀況發生:
1 | console.log(myName); // undefined |
但這個問題並不大,主要是 var
有一個滿麻煩的問題,就是若重複宣告變數,只會被覆蓋掉而不會出現錯誤:
1 | var myName = 'Ray'; |
那麼這種狀況在實際開發上是有可能養出一些蟲子,更不用說作用域的問題:
1 | for(var i = 0; i < 10; i++) { |
畢竟 var
是以函式作用域為主。
因此在 ES6 的 let
與 const
就可以解決這個問題,而這兩個宣告變數都有各自的名稱
let
- 變數
const
- 常數
首先先講講 let
變數,這個與 var
非常雷同,甚至你可以 var
直接無痛改成 let
,但這時候你可能會問說「這樣子 let
跟 var
有什麼差異?」
差異非常的大,舉例來講 let
是以區塊為作用域
1 | for(var i = 0; i < 10; i++) { |
除此之外 let
不可重複宣告
1 | let myName = 'Ray'; |
而 const
就相對簡單一點了,使用 const
所宣告的變數就無法再次被重新賦予值
1 | const myName = 'Ray'; |
但是這邊有一個很特別的狀況,你是可以 var
與 ley
混用(通常不建議混用,作用域不同容易出現問題),但若是 let
先的話,就會出現錯誤:
1 | let myName = 'Ray'; |
反之若是 var
先宣告依然還是會出現錯誤:
1 | var myName = 'Ray'; |
那麼剛剛有講到 let
與 const
是以區塊為作用域,所以如果想要重複宣告的話,是可以這樣子寫的:
1 | let myName = 'Ray'; |