前端基础进阶(三):变量对象详解
2018-02-07 11:30
417 查看
https://segmentfault.com/a/1190000012646488 https://yangbo5207.github.io/wutongluo/
说明:此处只是记录阅读前端基础进阶的理解和总结,如有需要请阅读上面的链接
一、执行上下文的生命周期
1.创建阶段:在创建阶段会创建变量对象,确定作用域链,以及this指向
2.执行阶段:执行其他代码,包括给变量赋值和执行其他代码
二、创建阶段的具体过程:
1.建立arguments对象。即给函数参数建立对应的变量对象,并存储参数值
2.检查当前上下文的函数声明(即用function声明的函数)用函数名建立一个变量对象,对象的值是指向函数的地址指针,如果同名的变量对象已存在则覆盖原变量对象的值
3.检查当前上下文的变量声明(以var声明的)给变量名建立对应的变量对象并赋值undefined,如果同名的变量对象已存在则不建立,原变量对象的值不受影响
上面的例子,根据执行上下文的生命周期,JavaScript引擎会先创建函数foo的变量对象VO{foo},值为函数foo的地址指针,然后再检查变量声明要建立变量foo的变量对象时发现同名的变量对象foo已存在所以跳过建立,创建阶段完成,接着进入执行阶段。首先打印到控制台console.log(foo),然后给变量对象foo赋值20
因此正确的执行顺序是:
从实际执行的顺序看,函数foo的位置提升到了第一行,这就是大家常说的变量提升的问题。
执行上下文未进入执行阶段时变量对象是不能访问的,进入执行阶段后变量对象转换为活动对象(AO)变量对象就能访问了。因此变量对象和活动对象他们其实都是同一个对象,只是处于执行上下文的不同生命周期。不过只有处于函数调用栈栈顶的执行上下文中的变量对象,才会变成活动对象
说明:此处只是记录阅读前端基础进阶的理解和总结,如有需要请阅读上面的链接
一、执行上下文的生命周期
1.创建阶段:在创建阶段会创建变量对象,确定作用域链,以及this指向
2.执行阶段:执行其他代码,包括给变量赋值和执行其他代码
二、创建阶段的具体过程:
1.建立arguments对象。即给函数参数建立对应的变量对象,并存储参数值
2.检查当前上下文的函数声明(即用function声明的函数)用函数名建立一个变量对象,对象的值是指向函数的地址指针,如果同名的变量对象已存在则覆盖原变量对象的值
3.检查当前上下文的变量声明(以var声明的)给变量名建立对应的变量对象并赋值undefined,如果同名的变量对象已存在则不建立,原变量对象的值不受影响
console.log(foo); // function foo var foo = 20; function foo() { console.log('function foo') }
上面的例子,根据执行上下文的生命周期,JavaScript引擎会先创建函数foo的变量对象VO{foo},值为函数foo的地址指针,然后再检查变量声明要建立变量foo的变量对象时发现同名的变量对象foo已存在所以跳过建立,创建阶段完成,接着进入执行阶段。首先打印到控制台console.log(foo),然后给变量对象foo赋值20
因此正确的执行顺序是:
// 首先将所有函数声明放入变量对象中 function foo() { console.log('function foo') } // 其次将所有变量声明放入变量对象中,但是因为foo已经存在同名函数,因此此时会跳过undefined的赋值 // var foo = undefined; // 然后开始执行阶段代码的执行 console.log(foo); // function foo foo = 20;
从实际执行的顺序看,函数foo的位置提升到了第一行,这就是大家常说的变量提升的问题。
执行上下文未进入执行阶段时变量对象是不能访问的,进入执行阶段后变量对象转换为活动对象(AO)变量对象就能访问了。因此变量对象和活动对象他们其实都是同一个对象,只是处于执行上下文的不同生命周期。不过只有处于函数调用栈栈顶的执行上下文中的变量对象,才会变成活动对象
相关文章推荐
- 前端基础进阶变量对象详解
- 前端基础进阶(三):变量对象详解
- 前端基础进阶(三):变量对象详解
- Python--前端基础之JavaScript(JS的引入方式,JS的变量、常量和标识符,JS的数据类型,运算符,流程控制,JavaScript的对象)
- 前端基础进阶(十一):详细图解jQuery对象,以及如何扩展jQuery插件
- 前端基础进阶(十二):深入核心,详解事件循环机制
- 前端基础进阶(九):图例详解那道setTimeout与循环闭包的经典面试题
- 前端基础进阶(十):深入核心,详解事件循环机制
- JAVA基础初探(三)面向对象思想、类与对象、成员变量与局部变量、构造方法、static关键字详解
- 前端高质量知识(三)-JS变量对象详解
- 前端基础进阶(八):深入详解函数的柯里化
- 前端基础进阶(九):详解面向对象、构造函数、原型与原型链
- 前端基础进阶(七):详解面向对象、构造函数、原型与原型链
- 前端基础进阶(十):面向对象实战之封装拖拽对象
- 前端基础进阶(八):详细图解jQuery对象,以及如何扩展jQuery插件
- 走向面试之数据库基础:三、SQL进阶之变量、事务、存储过程与触发器
- 网站前端_JavaScript-基础入门.0009.JavaScript对象类型
- web前端总结-----CSS基础详解(二)
- java基础进阶(一)——创建和销毁对象
- Python - 类(class)的变量 和 对象(object)的变量 详解 及 代码