前言

在學(xué)習(xí)JavaScript時(shí)大家一定都知道，外部空間不能訪問(wèn)內(nèi)部變量，我們往往只知道這一基本規(guī)則，那實(shí)現(xiàn)這一基本規(guī)則的基本底層原理是什么呢？今天我將從小白的角度來(lái)帶大家理解作用域鏈，希望能給大家一些幫助！

作用域

1.什么是作用域

簡(jiǎn)單來(lái)說(shuō)，作用域（英文：scope）是據(jù)名稱來(lái)查找變量的一套規(guī)則，可以把作用域通俗理解為一個(gè)封閉的空間，這個(gè)空間是封閉的，不會(huì)對(duì)外部產(chǎn)生影響，外部空間不能訪問(wèn)內(nèi)部空間，但是內(nèi)部空間可以訪問(wèn)將其包裹在內(nèi)的外部空間。

2.[[Scopes]]屬性

在javascript中，每個(gè)函數(shù)都是一個(gè)對(duì)象，在對(duì)象中有些屬性我們可以訪問(wèn)，有些我們是不能自由訪問(wèn)的，[[Scopes]]屬性就是其中之一，這個(gè)屬性只能被JavaScript引擎讀取。

其實(shí)[[scope]]就是我們常說(shuō)的作用域，其中存儲(chǔ)了作用域運(yùn)行期的上下文集合。

在這里因?yàn)閒unc.prototype.constructor和func指向同一個(gè)函數(shù)，所以在這里我們通過(guò)訪問(wèn)函數(shù)func的原型對(duì)象來(lái)查看[[Scopes]]屬性

3.作用域鏈

[[scope]]中存儲(chǔ)的執(zhí)行期的上下文對(duì)象的集合，這個(gè)集合呈鏈?zhǔn)竭B接，我們把這種鏈?zhǔn)竭B接叫做作用域鏈。JavaScript正是通過(guò)作用域鏈來(lái)查找變量的，其查找方式是沿著作用域鏈的頂端依次向下查詢（在哪個(gè)函數(shù)內(nèi)部查找對(duì)象，就在哪個(gè)函數(shù)作用域鏈中查找）

4.圖解查找變量原理

//以如下代碼為例說(shuō)明JavaScript通過(guò)作用域鏈查找變量的原理**
function a() {
  function b() {
  //這里原來(lái)我給的b的值是234，后面經(jīng)過(guò)評(píng)論區(qū)提醒后面的圖寫的是123，所以我將b的值改為了123
      var b = 123;
  }
  var a = 123;
  b();
}
var glob = 100;

1.當(dāng)全局函數(shù)a()被定義時(shí)，作用域鏈如下

    函數(shù)的[[Scopes]]屬性指向作用域鏈對(duì)象，此時(shí)作用域鏈只有一個(gè)鍵值對(duì)，這個(gè)鍵值對(duì)指向全局對(duì)象，全局對(duì)象存儲(chǔ)了全局下可以訪問(wèn)的東西，也就是最外層作用域，大家都可以訪問(wèn)的。

2.當(dāng)全局函數(shù)a()被激活調(diào)用時(shí)，作用域鏈如下

此時(shí)作用域鏈能夠第一個(gè)訪問(wèn)的是Activation Object中的鍵值對(duì)，如果沒(méi)有才訪問(wèn)全局對(duì)象

3.函數(shù)a()中函數(shù)b被定義時(shí)，b的作用域鏈如下

當(dāng)b只是被定義沒(méi)有被調(diào)用時(shí)，b的作用域鏈和a是相同的

4.當(dāng)函數(shù)a()中的函數(shù)b被激活調(diào)用時(shí)，作用域鏈如下

作用域鏈最先指向函數(shù)b()的Activation Object，查找變量也是按作用域鏈順序訪問(wèn)，找到就停止

總結(jié)

之所以外部作用域不能訪問(wèn)內(nèi)部作用域的原因是外部作用域的作用域鏈沒(méi)有內(nèi)部作用域的Activation Object，所以無(wú)法訪問(wèn)內(nèi)部變量，內(nèi)部作用域訪問(wèn)變量的順序是按照作用域鏈，先從里面查找，沒(méi)有就沿著作用域鏈向外找，外部是全局作用域。

到此這篇關(guān)于JavaScript作用域鏈底層原理的文章就介紹到這了,更多相關(guān)JavaScript作用域鏈內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！