前端小组分享会之异步回调函数中的上下文

Posted 2020-09-27 一颗顽豆

异步加载：又叫非阻塞加载，浏览器在下载执行js的同时，还会继续进行后续页面的处理。实现如：回调函数 、setTimeout 、 setInterval 

回调函数（callback）： 自己理解就是函数A里嵌套函数B B可能用到A中的变量，，B成为回调函数

function a (){
  var x = 1;
  function b(){
    console.log(++x)     
  } 
  b() 
}
a() //2

上下文（Execution Context）: 执行上下文（简称上下文）决定了Js执行过程中可以获取哪些变量、函数、数据，一段程序可能被分割成许多不同的上下文，每一个上下文都会绑定一个变量对象（variable object），它就像一个容器，用来存储当前上下文中所有已定义或可获取的变量、函数等。

每个上下文拥有自己的变量对象。

作用域链和原型链（二维作用域链查找变量）

作用域链（scope chain）的主要作用就是用来进行变量查找
原型链主要作用是通过函数对象原型进行变量查找

基本类型变量查找方法先在作用域链查找（父级---》window）没有的话到原型链查找（父级原型链---》object的原型链）

function a() {
  alert(x);
}
Object.prototype.x = 10;
 
a(); // 10

var x = 30;
function foo() {
  var x = 20; 
  function bar() {
    alert(x);
  } 
  bar();
} 
 foo(); // 20

function foo() {
  var x = 20; 
  function bar() {
    alert(x);
  }
 
  bar();
} 
Object.prototype.x = 10;
 
foo(); // 20

　　

刚测试了下只有Object.prototype.x = 10才可以输出 foo.prototype.x =10 无效(。。。。)

 

ES6 let 声明前引用会出现 not defined