JS中let和var 的區別

• 簡單介紹let
• • var的常見變量提升
  • ES6可以用let定義塊級作用域變量
  • let配合for循環的獨特應用
  • let沒有變量提升與暫時性死區
  • let變量不能重復聲明

簡單介紹let

let是ES6中新增命令，用來聲明局部的變量。用法類似var，但是所聲明的變量，只會在let命令所在的代碼塊內有效，而且有暫時性死區的約束。

var的常見變量提升

var a = 99; // 全局變量a f(); // f是函數，雖然定義在調用的后面，但是函數聲明會提升到作用域的頂部。 console.log(a); // a=>99, 此時是全局變量的a function f() {console.log(a); // 當前的a變量是下面變量a聲明提升后，默認值undefinedvar a = 10;console.log(a); // a => 10 }// 輸出結果： undefined 10 99

ES6可以用let定義塊級作用域變量

ES6之前，用var來聲明變量，而且JS只有函數作用域和全局作用域，沒有塊級作用域，所以{}限定不了var聲明變量的訪問范圍。
例如：

{var i = 9; } console.log(i); // 9

ES6新增的let，可以聲明塊級作用域的變量

{ let i = 9; // i變量只在 花括號內有效！！！ } console.log(i); // Uncaught ReferenceError: i is not defined

let配合for循環的獨特應用

let非常適合用于for循環內部的塊級作用域。JS中的for循環體比較特殊，每次執行的都是一個全新的獨立的塊級作用域。用let聲明的變量傳入到for循環體的作用域后，不會發生改變。不會受外界的影響。
例如：

for (var i = 0; i <10; i++) { setTimeout(function() { // 同步注冊回調函數到 異步的 宏任務隊列。console.log(i); // 執行此代碼時，同步代碼for循環已經執行完成}, 0); } // 輸出結果 10 共10個 // 這里面的知識點： JS的事件循環機制，setTimeout的機制等

把var改成let聲明

// i雖然在全局作用域聲明，但是在for循環體局部作用域中使用的時候，變量會被固定，不受外界干擾。 for (let i = 0; i < 10; i++) { setTimeout(function() {console.log(i); // i 是循環體內局部作用域，不受外界影響。}, 0); } // 輸出結果： 0 1 2 3 4 5 6 7 8 9

let沒有變量提升與暫時性死區

用let聲明的變量，不存在變量的提升，而且要求必須等let聲明語句執行完之后，變量才能使用，不然會報 Uncaught ReferenceError 錯誤
例如：

console.log(aicoder); // 錯誤：Uncaught ReferenceError ... let aicoder = 'aicoder.com'; // 這里就可以安全使用aicoder

ES6明確的規定，如果區塊中存在let和const命令，這個區塊對這些命令聲明的變量，從一開始就形成了封閉作用域。凡是在聲明之前的就使用這些變量，就會報錯。
總之，在代碼塊內，使用let命令聲明變量之前，該變量都是不可用的，這在語法上，稱為“暫時性死區”（temporal dead zone，簡稱 TDZ）。

let變量不能重復聲明

let不允許在相同作用域內，重復聲明同一個變量。否則報錯：Uncaught SyntaxError: Identifier ‘XXX’ has already been declared
例如：

let a = 0; let a = 'sss'; // Uncaught SyntaxError: Identifier 'a' has already been declared

總結

以上是生活随笔為你收集整理的JS中 let 和var的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。