---

title: 深入理解js系列一作用域是什么？ date: 2018-02-06 02:15:59 tags:

• 深入理解js系列
• 作用域 categories: JavaScript

---

作用域是什么？

變量的作用域到底是如何在js中工作的？

js是解釋型語(yǔ)言而無(wú)法編譯嗎？

什么是詞法作用域？

RHS查詢(xún)與LHS查詢(xún)？

理解作用域

js中的作用域可以理解為一套定義的規(guī)則，用來(lái)管理js引擎根據(jù)標(biāo)識(shí)符名稱(chēng)進(jìn)行變量查找，并確定當(dāng)前執(zhí)行代碼對(duì)這些變量的訪(fǎng)問(wèn)權(quán)限。

編譯原理

要想深入理解js的作用域，我們必須得先知道js事實(shí)上是一門(mén)編譯型語(yǔ)言（動(dòng)態(tài)編譯）-- js引擎實(shí)際上是動(dòng)態(tài)編譯程序然后立即執(zhí)行。與傳統(tǒng)編譯語(yǔ)言在構(gòu)建前編譯不同的是：js的編譯發(fā)生在代碼執(zhí)行前（有時(shí)是執(zhí)行中）的很短時(shí)間內(nèi)，而且編譯完通常就會(huì)馬上執(zhí)行它。另外，對(duì)比傳統(tǒng)編譯，js引擎在語(yǔ)法分析和代碼生成階段有特定的步驟對(duì)運(yùn)行性能進(jìn)行優(yōu)化。這也是后面會(huì)談到的eval()和with() 影響運(yùn)行效率的原因。

編譯的三個(gè)步驟

我們先來(lái)看看在傳統(tǒng)編譯語(yǔ)言中，一段源程序在執(zhí)行前通常要經(jīng)歷的三個(gè)步驟，js作為一門(mén)動(dòng)態(tài)編譯語(yǔ)言，同樣也會(huì)經(jīng)歷這些步驟：

分詞／詞法分析（將源代碼分解成詞法單元）

解析／語(yǔ)法解析（轉(zhuǎn)換為一棵由元素逐級(jí)嵌套組成代表程序語(yǔ)法的抽象語(yǔ)法樹(shù)AST）

代碼生成（將AST轉(zhuǎn)換為可執(zhí)行代碼）

在js中，js引擎負(fù)責(zé)整個(gè)js程序的編譯和執(zhí)行過(guò)程，編譯器負(fù)責(zé)語(yǔ)法分析以及代碼生成。

js引擎做了什么？

當(dāng)遇到var a = 2這段程序，js引擎做了什么？

首先編譯器會(huì)將這段代碼分解成詞法單元

編譯器再將詞法單元解析成一個(gè)樹(shù)結(jié)構(gòu)

編譯器開(kāi)始進(jìn)行代碼生成

遇到var a，查詢(xún)作用域鏈?zhǔn)欠裼凶兞縜： 。 有a：跳過(guò)繼續(xù)編譯 。 無(wú)a：在當(dāng)前作用域聲明一個(gè)變量a

為引擎生成運(yùn)行時(shí)所需代碼

引擎查詢(xún)作用域鏈?zhǔn)欠翊嬖谧兞縜： 。存在：使用變量a執(zhí)行賦值操作 。不存在：拋出一個(gè)異常

可以看出，變量的賦值操作會(huì)執(zhí)行兩個(gè)動(dòng)作：
一個(gè)由編譯器在編譯時(shí)處理，另一個(gè)由引擎在運(yùn)行時(shí)處理。

RHS查詢(xún)與LHS查詢(xún)？

LHS查詢(xún)：查找變量的容器本身（a=1） RHS查詢(xún)： 查找變量的值（console.log(a)）

function foo(a){console.log(a) } foo(2) //RHS查詢(xún) // 將2作為參數(shù)傳給foo函數(shù)，給參數(shù)a隱式地分配值時(shí)進(jìn)行了一次LHS查詢(xún) 復(fù)制代碼

作用域嵌套

異常

在作用域中找不到變量

在作用域中找變量

總結(jié)：
不成功的RHS引用拋ReferenceError

總結(jié)

以上是生活随笔為你收集整理的深入理解js系列一作用域是什么的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。