js-作用链域

以前理解的作用链域

  • 函数在执行的过程中,首先从自身的函数作用域找变量;
  • 如果从自身内部找不到变量,就向上一层寻找变量,一直到全局变量为止;
  • 例子:
var a = 1
function fn1(){
  function fn2(){
    console.log(a)
  }
  function fn3(){
    var a = 4
    fn2()
  }
  var a = 2
  return fn3
}
var fn = fn1()
fn() //输出多少 输出2

1 首先从fn()执行的函数fn3;
2 fn3里面定义了var a=4;然后执行了fn2()
3 fn2()打印了a,但是fn2内部并没有定义a,所以向上一层,在fn1里面寻找到a为2;

经过查找资料得到的理解

gitbook
segmentFault
颜海静博客
汤姆大叔博客

  • 一系列活动的执行上下文(EC)形成了栈。栈底是全局上下文,栈顶是活动的当前上下文,压栈、出栈类似数组的pop以及push。
    压栈:全局EC-->局部EC1-->局部EC2-->当前EC
    出栈:全局EC<--局部EC1<--局部EC2<--当前EC
    当js代码被载入浏览器中时,默认进入的是一个全局的执行上下文。挡在全局上下文中调用执行一个函数时,程序流就进入被调用的函数内,此时引擎就会为函数创建一个新的执行上下文,并将其压入到执行上下文堆栈的顶部。浏览器总是执行在当前堆栈顶部的执行上下文,一旦执行完毕,该上下文就会被从当前堆栈弹出,然后,进入其下的上下文执行代码。这样,堆栈中的上下文就会被一次执行并且弹出堆栈,知道回到全局上下文。
var a = 1;

function fn(){
  console.log("1 "+a); //undefined
  var a = 5;
  console.log("2 "+a);  // 5
  a++;
  var a;
  fn3();
  fn2();
  console.log("3 "+a); //6

  function fn2(){
    console.log("4 "+a); // 6
    a = 20;
    console.log("8 "+a);
  }
  console.log("9 "+a);
}

function fn3(){
  console.log("5 "+a) //1
  a = 200;
  console.log("7 "+a) //1
}

fn();
console.log("6 "+a); //1

结果:


代码结果
  • 第4处输出6,然后下面的a=20,将fn2上一层的a赋值为a(并不是全局的)
  • 第5处输出1,然后下面的a=200,将fn3上一层(也就是全局)的a赋值为200
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容