幾乎所有的編程語言都能夠儲存變量，並且能在之后對這個變量值進行訪問或修改，正是儲存和訪問變量的能力將狀態帶給了程序，那么，這些變量儲存在哪里呢？程序需要時又是如何找到他們？這些問題說明需要一套設計良好的規則來儲存變量，並且之后可以方便的找到這些變量，這套規則被稱為作用域。
1、了解編譯原理
盡管將JS歸類為“動態”或“解釋執行”腳本語言，但事實上它是一門編譯語言。但是與傳統編譯語言不同的是，它不是提前編譯的，編譯結果也不能在分布式系統中進行移植。JS引擎進行編譯的步驟與傳統的語言非常相似，程序中一段源代碼在執行之前會經歷三個步驟，統稱為“編譯”。
- 分詞/詞法分析
這個過程會將由字符組成的字符串分解成有意義的代碼塊，這些代碼塊被稱為詞法單元。例如，考慮程序
var a = 2;。這段程序通常會被分解成 為下面這些詞法單元：var、a、=、2 、;。
- 解析/語法分析
這個過程是將詞法單元流（數組）轉換成一個由元素逐級嵌套所組成的代表了程序語法結構的樹。這個樹被稱為“抽象語法樹”（Abstract Syntax Tree，AST）。
var a = 2;的抽象語法樹中可能會有一個叫作VariableDeclaration的頂級節點，接下來是一個叫作 Identifier（它的值是 a）的子節點，以及一個叫作 AssignmentExpression 的子節點。AssignmentExpression 節點有一個叫作 NumericLiteral（它的值是 2）的子節點。
- 代碼生成
AST轉換為可執行代碼的過程稱被稱為代碼生成,簡單來說就是有某種方法可以將
var a = 2;的AST轉化為一組機器指 令，用來創建一個叫作a的變量（包括分配內存等），並將一個值儲存在a中。
編譯流程如下圖所示：
JS引擎比傳統的編譯語言編譯器復雜很多，在語法分析和代碼生成階段有特定的步驟來對性能進行優化，大部分情況下編譯發生在代碼之前的前幾微秒，在討論作用域背后，js引擎用了各種辦法來保證性能最佳。
Tips:我們平時在寫JS代碼的時候，一個語句結尾要加分號（;）,便於JS編譯器編譯。
2、理解作用域
我們先了解JS編譯過程中幾個名詞，JS引擎，編譯器，作用域。
2.1.名詞介紹
- JS引擎：從頭到尾負責整個JS程序編譯過程。
- 編譯器：負責語法分析及代碼生成等。
- JS引擎：負責收集並維護由所有聲明的標識符（變量）組成的一系列查 詢，並實施一套非常嚴格的規則，確定當前執行的代碼對這些標識符的訪問權限。
2.2.變量賦值
對於var a=2;這段代碼，我們認為這就是申明一個為變量a且初始值為2，實際上，JS引擎認為這里有兩個完全不同的申明，一個由編譯器在編譯時處理，另一個則由引擎在運行時處理。
處理過程分為兩步：
1.遇到var a，編譯器會詢問作用域是否已經有一個該名稱的變量存在於同一個作用域的集合中。如果是，編譯器會忽略該聲明，繼續進行編譯；否則它會要求作用域在當前作用域的集合中聲明一個新的變量，並命名為a。
2.接下來編譯器會為引擎生成運行時所需的代碼，這些代碼被用來處理a = 2這個賦值操作。引擎運行時會首先詢問作用域，在當前的作用域集合中是否存在一個叫作a的變量。如果是，引擎就會使用這個變量；如果否，引擎會繼續查找該變量。
如果引擎最終找到a變量，就會將2賦值給它。否則就拋出異常。
Tips：聲明提前(hoist)-JS引擎在創建變量時，會將該變量提升到當前作用域的最前面。
總結：變量的賦值操作會執行兩個動作，首先編譯器會在當前作用域中聲明一個變量（如果之前沒有聲明過），然后在運行時引擎會在作用域中查找該變量，如果能夠找到就會對它賦值。
2.3.LHS查詢&RHS查詢
編譯器在編譯過程中的第二步生成了代碼，引擎在執行時，會通過查找變量a來判斷它是否已經聲明過。當變量出現在賦值操作的左側時進行LHS查詢，當變量出現在右側時進行RHS查詢。
console.log(a); //對a的引用時RHS引用，這里沒有對a賦予任何值，需要查找a的值。
a=2; //對a的引用是LHS引用，因為這里不關心a的值等於多少，只想為 =2 這個賦值操作找到一個目標(變量a);
LHS和RHS的含義是“賦值操作的左側或右側”並不一定意味着就是“= 賦值操作符的左側或右側”。賦值操作還有其他幾種形式，因此在概念上最好將其理解為“賦值操作的目標是誰（LHS）”以及“去找到XX變量的值，誰是賦值操作的源頭（RHS）”。
3、作用域嵌套
作用域是根據名稱查找變量的一套規則。實際情況中，通常需要同時顧及幾個作用域。 當一個塊或函數嵌套在另一個塊或函數中時，就發生了作用域的嵌套。因此，在當前作用 域中無法找到某個變量時，引擎就會在外層嵌套的作用域中繼續查找，直到找到該變量， 或抵達最外層的作用域（也就是全局作用域）為止。
參考以下代碼：
var name='peer';
function sayHello(){
alert('hello '+ name)
}
sayHello();
// 對name的RHS引用無法在函數sayHello完成，但是可以在上一級作用域中完成。
把作用域比喻成一個建築如下圖所示：
LHS和RHS引用都會在當前樓層進行查找，如果沒有找到，就會坐電梯前往上一層樓，如果還是沒有找到就繼續向上，以此類推。一旦抵達頂層（全局作用域），可能找到了你所需的變量，也可能沒找到，但無論如何查找過程都將停止。
4、總結
作用域是一套規則，用於確定在何處以及如何查找變量（標識符）。LHS和RHS查詢都會在當前執行作用域中開始，如果有需要就會向上級作用域繼續查找目標標識符，這樣每次上升一級作用域，最后抵達全局作用域，無論找到或沒找到都將停止。不成功的RHS 引用會導致拋出ReferenceError異常。不成功的LHS引用會導致自動隱式地創建一個全局變量（非嚴格模式下），掌握這些基本作用域知識能使我們更深入理解JS引擎的編譯過程來編寫更高性能的代碼。
參考資料:
《你不知道的JavaScript》