执行上下文、变量对象、作用域链、this

来源：互联网发布：曲面电视优缺点知乎编辑：程序博客网时间：2024/06/05 18:11

ecmascript内容
关键字、数据类型、语句、运行时实现、保留字、表达式、内置对象

几个重要的概念：
执行上下文、变量对象、作用域链、this

执行上下文（Execution context）{作用域链 sc、this、变量对象 vo}

可执行代码类型
全局代码
函数代码
eval代码

全局上下文> 全局代码
函数上下文 > 函数代码
eval上下文 > eval代码

EC桟

变量对象
作用：用来存储变量、声明式函数、函数形参

不同上下文中的变量对象

全局上下文> 全局对象
函数上下文 > 激活对象
eval上下文 > Calling context.vo

全局对象：内置：NaN、undefined、parseFloat、parseInt、Object、Function ……；输注对象：window alert ；用户添加：……
在程序执行前准备好
单例
可以任意位置访问该对象的属性
生命周期：从页面加载至页面关闭

激活对象（Activation Object）：
fun EC = {
vo：Activation Object ----------->{argument : Activation Object }
}

变量实例化（Variable Instantiation）
时期：进入上下文时，代码执行前
声明式函数 -------> 变量对象
函数形参 -------> 变量对象
变量 -------> 变量对象

JavaScript中同名标识符优先级
一般情况下是：声明式函数 > 形参 > 变量

变量初始化过程是这样的:
词法扫描以后. 把所有标识符找出来,
3种标识符：函数名、形参名、变量名, 是分三个阶段初始化的:

第一步:
初始化函数名,这个过程比较特殊. 因为需要同时创建函数对象, 然后把函数名,作为属性名添加给 variable object ,如果已经存在一个同名的则放弃添加属性名的过程,而直接把创建的函数对象的引用,作为这个属性的值. 如果之前不存在同名属性.则把当前函数名作为属性名,添加给这个variable object .并且对该属性设置特性集:设置属性无法被delete运算符删除.然后为属性赋值函数对象引用.

第二步:
形参初始化, 同样的,遇到同名的variable object的属性名,放弃添加属性操作. 如果属性名可用,则添加属性,同时,把undefined赋值给这个属性.并设置特性集,使该属性无法被删除.

第三步:
变量初始化,与形参初始化一样.

这里有个例外的初始化过程,发生在 eval code 中.
eval code中的变量初始化,不会为calling context 的 variable object 添加属性时,设置 [[DontDelete]]特性.所以可以被delete删除.

这就是为什么, 表面上看起来,函数名优先级高于形参,而形参又高于变量名的原因.

代码执行步骤：
进入上下文
进入上下文 -----> 初始化this、作用域链、变量对象 -----> 变量实例化 -----> 执行代码

不同上下文变量实例化的属性特性：
1、全局上下文，函数上下文: { Don't Delete }
2、eval上下文: 空

demo:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>variableInstantiation</title>
</head>
<body>
<script>
var x = 10;
window.y = 20;

delete window.x;
delete window.y;
alert(window.x);
alert(window.y);

eval("var z = 30;");
delete window.z;
alert(window.z);
</script>
</body>
</html>

作用域链（Scope China）
作用域链可看成数组成员是一个或多个变量对象

全局上下文
scope chain = [全局对象]

函数上下文
scope chain = [当前激活对象 + function.[[scope]]]
function.[[scope]] = 函数创建时所在 EC.scope chain

eval上下文
scope chain = calling context.scope chain

程序运行时可以改变作用域链的语句
with
catch

demo:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>test</title>
</head>
<body>
<script>
var x = 1;
var y = 2;

var z= 3;
var foo = {x: 10, y: 20};
with (foo) {
alert(x);
alert(y);
alert(z);
}

var ex = 3;
try{
notExist;
}catch(ex){
alert(ex);
}
</script>
</body>
</html>

this
不同上下文中的this

全局上下文
this = 全局对象
进入上下时确定
运行期间值不可改变

函数上下文
this = ?

Easy学习模式:
xxx(); this ---> window
xxx.yyy(); this---> xxx
xxx[yyy](); this ---> xxx

Reference用途 this\ delet \ typeof

this相关的后续介绍

0 0