ES6—— let 和 const 命令

• 引言
• 正文
• • let 命令
  • const 命令
• 結束語

http://toolusts.com/7gig

引言

本文主要講解ES6中變數的相關操作，變數的命名， 講解 var、 let 、 const 三者的區別

• 公眾號：前端印象
• 不定時有送書活動，記得關注~
• 關注後回覆對應文字領取：【面試題】、【前端必看電子書】、【資料結構與演算法完整程式碼】、【前端技術交流群】

正文

ES6中的 let 和 const 都是用來宣告變數的， 他們與 var 有所區別

let 命令

我們都知道在for迴圈中，我們命名的變數 i 一般都只是為了在這個迴圈中使用，才臨時命名的， 我們希望迴圈結束後，這個變數就消失， 但是卻相反，用 var 命名的變數，在 for 迴圈結束後並不會銷燬，而會存在於全域性中。

for(var i=0; i<5; i++) {
	console.log('迴圈'+ i)
}
console.log(i)

/* 輸出結果  */
迴圈1
迴圈2
迴圈3
迴圈4
5           // 這裡是迴圈外輸出的i 

但是如果我們在 for 迴圈中，用到 let 去命名變數會怎麼樣呢？

for(let i=0; i<5; i++) {
	console.log('迴圈'+ i)
}
console.log(i)

/* 輸出結果  */
迴圈1
迴圈2
迴圈3
迴圈4
undefined           // 這裡是迴圈外輸出的i,顯示未定義

這樣的話就解決了因為 var 命名導致的變數洩露的問題了, 其實它的本質就是作用域， let 只作用於他自身所在的程式碼塊內，而 var 是針對全域性都有效的。例如這一個簡單的例子：

{
	let i = 1
	var n = 2
}
console.log(i)
console.log(n)

/* 輸出結果 */
undefined
2

可以看到， let 命名的變數只存在於那個程式碼塊內，到外部就訪問不到了，而 var 就是針對全域性命名的。

const 命令

const 和 let 類似，也是命名的變數只能在它所在的程式碼塊內能被訪問得到，到外部就無法被訪問到，但是 const 與 let 的區別就在於， const 命名的變數是一個只讀變數，簡而言之就是命名了就無法在後面被修改，例如這個例子：

const a = 'apple'
let b = 'orange'

a = 'watermelon'
b = 'banana'

/* 輸出結果 */
a = 'watermelon'
  ^

顯而易見， 系統會直接報錯， 因為 const 命名的變數 a 是無法改變的， 後續無法對其進行賦值。

其實 const 命名變數以後， 也不是說就真的無法改變了， 因為const命名時其實是把箭頭指向了記憶體中的一個物件， 只要不改變這個物件地址， const 命名的變數還是可以變化的，例如：

const list1 = []

list1.push('變化1')

console.log(list1)

//  ['變化1']

可以看到 list1.pish(' 變化1 ') 不會改變 變數 list1在記憶體中的地址。

但是 list1 = [ '變化1' ] 就會改變 list1 在記憶體中的地址，所以會報錯

const list1 = []

list1 = ['變化1']

console.log(list1)

//  報錯：list1 = ['變化1']
              ^

結束語

這就是 let 和 const 的簡單應用，希望對大家有所幫助， 下一篇ES6（2）將講解變數的解構賦值