JavaScript必备基础-作用域作用域链详解

240 阅读2分钟

这是我参与8月更文挑战的第19天,活动详情查看:8月更文挑战

作用域作用域链

[[scopel]:

每个javascript函数都是一个对象, 对象中有些属性我们可以访问,但有些不可以,这些属性仅供javascript引擎存取,[[scopel]就是其中一 个。
[[scope]]指的就是我们所说的作用域,其中存储了运行期上下文的集合。

作用域链:

[[scope]]中 所存储的执行期上下文对象的集合,这个集合呈链式链接,我们把这种链式链接叫做作用域链。

运行期上下文:AO

当函数执行时,会创建一个称为执行期上下文的内部对象。一个执行期上下文定义了一个函数执行时的环境,函数每次执行时对应的执行上下文都是独一无二的,所以多次调用一个函数会导致创建多个执行上下文,当函数执行完毕,执行上下文被销毁。

查找变量:从作用域链的顶端依次向下查找。

我们来举例讨论一下吧

function a() {
  function b() {
    var b = 234;
  }
  var a = 123;
  b();
}
var glob = 100;
a();


  1. 在a函数定义的时候:
    a 会产生一个作用域 [[scopel],里面存的是a定义的时候的执行期上下文(全局的执行期上下文GO)如图

impicture_20210819_153834.png

  1. a执行的时候(执行的前一刻)a产生一个AO,把自己AO放在作用域链的最顶端,形成一个新的作用域链

impicture_20210819_153921.png

  1. a的执行产生了b的定义,b的定义的过程中会有一个 [[scopel],这个 [[scopel],就是a的作用域链

impicture_20210819_153943.png

  1. b执行的时候会创建一个自己的执行期上下文,把他放到作用域链的最顶端

impicture_20210819_154018.png

a作用域链里面的AO跟b作用域链里面的AO是不是一样呢
我们看看这个例子

function a()、 {
  function b() {
    var bb = 234;
    aa=0;
  }
  var aa = 123;
  b();
  console.log(aa) ;
}
var glob = 100;
a();


这个时候答应的aa等于什么呢,
诺,看看结果吧

a作用域链里面的AO跟b作用域链里面的AO就是一样
我们在任何一个函数中找他的作用域链的时候,只需要找他的作用域链