js执行上下文-Toy模板网

这篇具有很好参考价值的文章主要介绍了js执行上下文。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

需求

创造执行上下文，是为了把变量声明给保存下来，在执行时，好找到变量用

一见如故

看代码要分执行前（构建执行上下文）和执行时去看
执行上下文的组成
1、词法环境：[全局对象]、scope、outer
2、This Binding：提供this的访问
构建执行上下文
1、处理声明
2、检查重复定义
3、初步赋值

全局执行上下文

全局对象为window或者global
outer为null
This Binding指向window

构建全局执行上下文
1、处理声明
①找到全局中的var声明、顶级的全局函数声明（不在大括号内、不在函数中，以function开头的），并记录全局对象中
②找到顶级的let、const、class，记录到全局scope中，并记录这些标识符的位置，在此之前不允许赋值
2、检查重复定义
检查全局scope中的变量名在全局对象及全局scope中有没有重复出现，重复出现会报错
3、初步赋值（在代码执行时，访问一个没有被赋值的变量会报错）
①先给var申明的变量赋值为undefined
②再给函数标识符赋值一个函数对象，其中属性包含：
prototype、name（函数名）、length（形参长度）、arguments、[[scope]]
函数对象的隐式属性scope指向栈顶执行上下文

函数执行上下文

'函数对象’是在函数声明时产生的，函数对象有个隐式的[[scope]]属性，指向当前栈顶的执行上下文
'函数的执行上下文’包含scope、outer、this binding，是在函数执行的前一刻生成的。并直接压入执行上下文栈顶，函数执行结束，弹出栈顶
如果在当前执行上下文的scope中找不到变量，就沿着outer找，outer指向函数对象的[[scope]]

for循环中的执行上下文

// 使用let的话，小括号和大括号都会生成各自的执行上下文
// 当前执行上下文中找不着，就沿着链找，就会找到小括号中的i
for(let i; i< 5;i++){
	setTimeout(function(){
		console.log(i)
	},0)
}
// 0,1,2,3,4
// 使用var的话，var声明的变量在全局对象中
for(var i; i< 5; i++){
	setTimeout(function(){
		console.log(i)
	},0)
}
// 5,5,5,5,5

函数中的this

一、指向函数执行上下文的this binding，默认是window，但是改变
1、隐式绑定this（对象’.'的方式）
2、显示绑定this（call、apply）
二、在开发中this为什么难：
在框架中函数多出现以回调的模式，所以它去怎么绑定this的，我们并不知道
三、箭头函数的执行上下文没有this binding，所以没法绑定this，没法new，它会去找其作用域链中的this文章来源地址https://www.toymoban.com/news/detail-431775.html

到了这里，关于js执行上下文的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！