本篇是《你不知道的JavaScript》的讀書筆記 什麼是作用域？ 程式離不變數，那麼變數存儲在哪裡？程式需要時如何找到他們？ 這些問題說明需要一套設計良好的 規則 來存儲變數， 並且之後可以方便地找到這些變數。這套規則被稱為 作用域 。 作用域負責收集並維護由所有聲明的標識符（變數） 組成的一系列 ...
本篇是《你不知道的JavaScript》的讀書筆記
什麼是作用域？
程式離不變數，那麼變數存儲在哪裡？程式需要時如何找到他們？
這些問題說明需要一套設計良好的規則來存儲變數， 並且之後可以方便地找到這些變數。這套規則被稱為作用域。
作用域負責收集並維護由所有聲明的標識符（變數） 組成的一系列查詢， 並實施一套非常嚴格的規則， 確定當前執行的代碼對這些標識符的訪問許可權。
作用域嵌套
當一個塊或函數嵌套在另一個塊或函數中時， 就發生了作用域的嵌套。 因此， 在當前作用域中無法找到某個變數時， 引擎就會在外層嵌套的作用域中繼續查找， 直到找到該變數，或抵達最外層的作用域（也就是全局作用域） 為止。
function foo(a) {
console.log( a + b ); // foo的作用域中沒有變數b，去外層找
}
var b = 2;
foo( 2 ); // 4詞法作用域
剛學的時候就知道JavaScript是詞法作用域，那麼究竟是什麼意思？
JavaScript的源代碼在執行之前會在編譯器中經歷詞法分析、語法分析、代碼生成等環節。
詞法化的過程會對源代碼中的字元進行檢查，如果是有狀態的解析過程，還會賦予單詞語義。詞法作用域是由你在寫代碼時將變數和塊作用域寫在哪裡決定的，因此當詞法分析器處理代碼時會保持作用域不變。
詞法作用域意味著作用域是由書寫代碼時函數聲明的位置來決定的。編譯的詞法分析階段基本能夠知道全部標識符在哪裡以及是如何聲明的，從而能夠預測在執行過程中如何對它們進行查找。
作用域氣泡由其對應的作用域塊代碼寫在哪裡決定， 它們是逐級包含的。
欺騙詞法
正常情況下，詞法作用域完全由寫代碼期間函數所聲明的位置來定義。但是JavaScript也有兩種機制可以在運行的時候來“修改”（也可以說欺騙）詞法作用域。eval()和with。
JavaScript 引擎會在編譯階段進行數項的性能優化。其中有些優化依賴於能夠根據代碼的詞法進行靜態分析，並預先確定所有變數和函數的定義位置，才能在執行過程中快速找到標識符。但如果引擎在代碼中發現了 eval(..) 或 with，它只能簡單地假設關於標識符位置的判斷都是無效的，因為無法在詞法分析階段明確知道 eval(..) 會接收到什麼代碼，這些代碼會如何對作用域進行修改，也無法知道傳遞給 with 用來創建新詞法作用域的對象的內容到底是什麼。那麼所有的優化可能都是無意義的，因此最簡單的做法就是完全不做任何優化。
如果代碼中大量使用 eval(..) 或 with ，那麼運行起來一定會變得非常慢。無論引擎多聰明，試圖將這些悲觀情況的副作用限制在最小範圍內，也無法避免如果沒有這些優化，代碼會運行得更慢這個事實。
提升
先看個小慄子
console.log(a)
var a = 2;直覺上認為，JavaScript是從上而下一行一行執行的，應該會報錯ReferenceError. 但實際上這裡會輸出undefined.
引擎會在解釋 JavaScript 代碼之前首先對其進行編譯。編譯階段中的一部分工作就是找到所有的聲明，並用合適的作用域將它們關聯起來。包括變數和函數在內的所有聲明都會在任何代碼被執行前首先被處理。
所以上述慄子可以理解為
var a;
console.log(a); // undefined
a = 2;定義在編譯階段進行，賦值留在原地等待執行階段，這個過程就叫做提升。
需要註意的是：
- 函數聲明會被提升，但是函數表達式不會被提升
foo1(); // 'foo1'
foo2(); // TypeError : foo2 is not a function 此處的foo2未被賦值，為undefined
function foo1(){
console.log('foo1');
}
var foo2 = function (){
console.log('foo2');
}
- 函數會首先被提升，然後才是變數
foo(); //foo1 而不是TypeError 說明函數聲明先被提升，然後才是變數提升，但是同名，所以變數的聲明被忽略了
var foo = function (){
console.log('foo2');
}
function foo(){
console.log('foo1');
}
foo(); //foo2 執行賦值之後，foo函數輸出foo2閉包
閉包是基於詞法作用域寫代碼時所產生的自然結果，閉包的創建和使用在代碼中隨處可見，我們需要的是根據自己的意願來識別，擁抱和影響閉包的思維環境。
當函數可以記住並訪問所在的詞法作用域時，就產生了閉包，即使函數是在當前作用域之外執行。
function foo() {
var a = 2;
function bar() {
console.log(a);
}
return bar;
}
var baz = foo();
baz() // 2 --- 閉包效果函數baz（實際上就是bar的引用）可以訪問到foo內部作用域，雖然是在foo作用域外部執行的。而正是由於bar的存在，所以foo函數執行後，內部作用域沒有被銷毀，bar會使用這個內部作用域。
bar依然持有對該作用域的引用，這個引用就叫做閉包。閉包使得函數可以繼續訪問定義時詞法作用域。無論使用何種方式對函數類型的值進行傳遞，當函數在別處別調用時都可以觀察到閉包。
閉包的一個經典問題
for(var i = 1; i <= 5 ; i++) {
setTimeout(function timer() {
console.log(i);
},i * 1000);
}這裡會每間隔一秒，列印一個6。每次迴圈都會創建一個timer函數傳遞個setTimeout。timer中使用的變數i都是上層作用域中定義的變數i（閉包），當迴圈執行完之後，i的值為6，所以會連續列印5個6.
如果想依次列印1到5。有以下處理方式。
- 在定時器外創建一層作用域，使每次迴圈產生的timer使用的i都不一樣。
for(var i = 1; i <= 5 ; i++) {
(function(j){
setTimeout(function timer() {
console.log(j);
},j * 1000);
})(i)
}- 使用塊級作用域 - let
for(let i = 1; i <= 5 ; i++) {
setTimeout(function timer() {
console.log(i);
},i * 1000);
}塊級作用域會使每次創建定時器的作用域都不一樣。而且語言特性會使迴圈時記住上一次i的值。
