本文例項講述了ES6學習筆記之let與const用法。分享給大家供大家參考，具體如下：

在ES6中不是var，而是通過let來宣告變數，用const來宣告常量，有如下一些不同：

1、let與const作用域只限於當前程式碼塊{}，而var則沒有這種限制。

2、使用let、const申明的變數作用域不會被提升。例如：

console.log(str);
var str="var declare";

控制檯輸出undefined；因為變數申明是在任意程式碼執行前處理的，在程式碼區中任意地方宣告變數和在最開始（最上面）的地方宣告是一樣的。也就是說，看起來一個變數可以在宣告之前被使用！這種行為就是所謂的“hoisting”，也就是變數提升，看起來就像變數的宣告被自動移動到了函式或全域性程式碼的最頂上。注意：僅僅是宣告提升了，定義並不會被提升。因此console.log()可以檢測到str的宣告，但是卻沒有定義，提示undefined。

console.log(str2);
let str2="let declare";

控制檯報錯：can't access lexical declaration `str2' before initialization，let不會把宣告提升到全域性之前，因此在console輸出str2時會報錯未宣告。

3、在相同的作用域下不能申明相同的變數，利用var可以宣告兩次同一個變數，並且後一個會覆蓋前面的宣告，而let、const不可以。

4、for迴圈體現let的父子作用域

var btns=document.querySelectorAll('button');
for (var i=0;i<btns.length;i++){
  btns[i].οnclick=function () {
    alert("第"+i+"個按鈕");
  }
}

由於var會提升作用域，當btns[i]在本程式碼塊{}找不到i時，會找到之前的for中的i。在函式迴圈執行時，並沒有觸發onclick，i一直++到5。當任意按鈕點選的時侯觸發onclick，此時i==5，因此無論按那個按鈕都會顯示“第5個按鈕”。

解決方法一：閉包處理

var btns=document.querySelectorAll('button');
for (var i=0;i<btns.length;i++){
  (function (i) {//通過引數傳遞i，在另一個函式內的i
    btns[i++].οnclick=function () {
      alert("第"+i+"個按鈕");
    }
  })(i);
}

閉包處理：閉包就是一個函式引用另外一個函式的變數，因為變數被引用著所以不會被回收，因此可以用來封裝一個私有變數,i是另一個函式作用域內的變數，不會隨著外迴圈而改變。

方法二：使用let的情況下，會自己區分為兩個作用域，每個btns[i]內的函式對應不同的變數i

for (let i=0;i<btns.length;i++){//內部為新的let作用域
  btns[i].οnclick=function (){
    alert("第"+i+"個按鈕");
  }
}

感興趣的朋友可以使用線上HTML/CSS/JavaScript程式碼執行工具：http://tools.jb51.net/code/HtmlJsRun測試上述程式碼執行效果。

更多關於JavaScript相關內容可檢視本站專題：《javascript面向物件入門教程》、《JavaScript錯誤與除錯技巧總結》、《JavaScript資料結構與演算法技巧總結》、《JavaScript遍歷演算法與技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程式設計有所幫助。