鏈接：https://pan.baidu.com/s/1CcFZoHIri1B8Z-Lz07SoYg 

提取碼：hu8c 

 

塊級綁定

var聲明變量的問題

使用var聲明變量

1. 允許重復的變量聲明：導致數(shù)據(jù)被覆蓋

2. 變量提升：怪異的數(shù)據(jù)訪問、閉包問題

3. 全局變量掛載到全局對象：全局對象成員污染問題

// 1. 允許重復的變量聲明：導致數(shù)據(jù)被覆蓋 var a = 1; function print(){ console.log(a) }//假設這里有一千行代碼 var a = 2; print(); // 2. 變量提升：怪異的數(shù)據(jù)訪問 if (Math.random() < 0.5) { var a = "abc"; console.log(a); }else {console.log(a); }console.log(a); // 2. 變量提升：閉包問題 var div = document.getElementById("divButtons") for (var i = 1; i <= 10; i++) { var btn = document.createElement("button"); btn.innerHTML = "按鈕" + i; div.appendChild(btn); btn.onclick = function () { console.log(i); //輸出11 } }// 循環(huán)結束后，i：11

// 3. 全局變量掛載到全局對象：全局對象成員污染問題 var abc = "123"; console.log(window.abc); var console = "abc"; console.log(console) var name = "abc";

使用let聲明變量

ES6不僅引入let關鍵字用于解決變量聲明的問題，同時引入了塊級作用域的概念

塊級作用域：代碼執(zhí)行時遇到花括號，會創(chuàng)建一個塊級作用域，花括號結束，銷毀塊級作用域

聲明變量的問題

1. 全局變量掛載到全局對象：全局對象成員污染問題

let聲明的變量不會掛載到全局對象

let a = 123; //let a = 456; // 檢查到，當前作用域（全局作用域）已聲明了變量a //let a = 123; function test(){ let a = 456; console.log(a)//456 }test(); 2. 允許重復的變量聲明：導致數(shù)據(jù)被覆蓋

let聲明的變量，不允許當前作用域范圍內(nèi)重復聲明

在塊級作用域中用let定義的變量，在作用域外不能訪問

let a = 123; //全局作用域定義a { let a = 456; //塊級作用域定義a console.log(a); //使用的是塊級作用域中的a }console.log(a) if (Math.random() < 0.5) { let a = 123; //定義在當前塊級作用域 console.log(a) //當前塊級作用域中的a }else {//這是另外一個塊級作用域，該作用域中找不到a console.log(a) }console.log(a); 3. 變量提升：怪異的數(shù)據(jù)訪問、閉包問題

使用let不會有變量提升，因此，不能在定義let變量之前使用它

底層實現(xiàn)上，let聲明的變量實際上也會有提升，但是，提升后會將其放入到“暫時性死區(qū)”，如果訪

問的變量位于暫時性死區(qū)，則會報錯：“Cannot access 'a' before initialization”。當代碼運行到該

變量的聲明語句時，會將其從暫時性死區(qū)中移除。

console.log(a) let a = 123;

在循環(huán)中，用let聲明的循環(huán)變量，會特殊處理，每次進入循環(huán)體，都會開啟一個新的作用域，并且將

循環(huán)變量綁定到該作用域（每次循環(huán)，使用的是一個全新的循環(huán)變量）

在循環(huán)中使用let聲明的循環(huán)變量，在循環(huán)結束后會銷毀