执行上下文、变量对象、作用域链、this
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相关的后续介绍