原文出处澳门太陽城集团登录网址

思考题

在《JavaScript深切之词法成效域和动态功能域》中,建议那样一道思课题:

var scope = “global scope”; function checkscope(){ var scope = “local
scope”; function f(){ return scope; } return f(); } checkscope();

1
2
3
4
5
6
7
8
9
var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f();
}
checkscope();

var scope = “global scope”; function checkscope(){ var scope = “local
scope”; function f(){ return scope; } return f; } checkscope()();

1
2
3
4
5
6
7
8
9
var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f;
}
checkscope()();

两段代码都会打字与印刷’local
scope’。即便两段代码试行的结果同样,可是两段代码究竟有怎么样区别吧?

随着就在下一篇《JavaScript深切之实施上下文栈》中,讲到了双面包车型客车界别在于实行上下文栈的浮动不等同,不过,假若是那样笼统的回应,依然显得非常不足详细,本篇就能够详细的深入分析实施上下文栈和施行上下文的切实可行变化历程。

切实推行深入分析

大家分析第一段代码:

var scope = “global scope”; function checkscope(){ var scope = “local
scope”; function f(){ return scope; } return f(); } checkscope();

1
2
3
4
5
6
7
8
9
var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f();
}
checkscope();

施行进程如下:

1.施行全局代码,创设全局施行上下文,全局上下文被压入施行上下文栈

ECStack = [ globalContext ];

1
2
3
    ECStack = [
        globalContext
    ];

澳门太陽城集团登录网址,2.全局上下文早先化

globalContext = { VO: [global, scope, checkscope], Scope:
[globalContext.VO], this: globalContext.VO }

1
2
3
4
5
    globalContext = {
        VO: [global, scope, checkscope],
        Scope: [globalContext.VO],
        this: globalContext.VO
    }

2.早先化的同期,checkscope
函数被创设,保存功能域链到函数的内部属性[[scope]]

checkscope.[[scope]] = [ globalContext.VO ];

1
2
3
    checkscope.[[scope]] = [
      globalContext.VO
    ];

3.实行 checkscope 函数,创制 checkscope 函数实践上下文,checkscope
函数实行上下文被压入实施上下文栈

ECStack = [ checkscopeContext, globalContext ];

1
2
3
4
    ECStack = [
        checkscopeContext,
        globalContext
    ];

澳门太阳集团城网址,4.checkscope 函数施行上下文起头化:

  1. 复制函数 [[scope]] 属性创立效用域链,
  2. 用 arguments 创制活动指标,
  3. 开端化活动目的,即出席形参、函数证明、变量申明,
  4. 将移动对象压入 checkscope 功效域链最上部。

并且 f 函数被制造,保存功能域链到 f 函数的在那之中属性[[scope]]

checkscopeContext = { AO: { arguments: { length: 0 }, scope: undefined,
f: reference to function f(){} }, Scope: [AO, globalContext.VO], this:
undefined }

1
2
3
4
5
6
7
8
9
10
11
    checkscopeContext = {
        AO: {
            arguments: {
                length: 0
            },
            scope: undefined,
            f: reference to function f(){}
        },
        Scope: [AO, globalContext.VO],
        this: undefined
    }

5.施行 f 函数,创立 f 函数实行上下文,f 函数实行上下文被压入推行上下文栈

ECStack = [ fContext, checkscopeContext, globalContext ]原文出处澳门太陽城集团登录网址。;

1
2
3
4
5
    ECStack = [
        fContext,
        checkscopeContext,
        globalContext
    ];

6.f 函数实行上下文开首化, 以下跟第 4 步一样:

  1. 复制函数 [[scope]] 属性创设效率域链
  2. 原文出处澳门太陽城集团登录网址。用 arguments 创造活动对象
  3. 早先化活动对象,即插手形参、函数声明、变量申明
  4. 将运动目的压入 f 作用域链最上端

fContext = { AO: { arguments: { length: 0 } }, Scope: [AO,
checkscopeContext.AO, globalContext.VO], this: undefined }

1
2
3
4
5
6
7
8
9
    fContext = {
        AO: {
            arguments: {
                length: 0
            }
        },
        Scope: [AO, checkscopeContext.AO, globalContext.VO],
        this: undefined
    }

7.f 函数施行,沿着功效域链查找 scope 值,重回 scope 值

8.f 函数实践完结,f 函数上下文从实施上下文栈中弹出

ECStack = [ checkscopeContext, globalContext ];

1
2
3
4
    ECStack = [
        checkscopeContext,
        globalContext
    ];

原文出处澳门太陽城集团登录网址。9.checkscope 函数奉行完成,checkscope 实施上下文从实施上下文栈中弹出

ECStack = [ globalContext ];

1
2
3
    ECStack = [
        globalContext
    ];

其次段代码就留下大家去尝试模拟它的举行进程。

var scope = “global scope”; function checkscope(){ var scope = “local
scope”; function f(){ return scope; } return f; } checkscope()();

1
2
3
4
5
6
7
8
9
var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f;
}
checkscope()();

原文出处澳门太陽城集团登录网址。然则,在下一篇《JavaScript浓密之闭包》中也会提及这段代码的实践进度。

前言

在《JavaScript浓厚之推行上下文栈》中讲到,当JavaScript代码实施一段可进行代码(executable
code)时,会创立对应的实行上下文(execution context)。

对于每一个推行上下文,皆有五个重要性质:

  • 变量对象(Variable object,VO)
  • 作用域链(Scope chain)
  • this

下一场分别在《JavaScript深刻之变量对象》、《JavaScript深入之功力域链》、《JavaScript深切之从ECMAScript标准解读this》中等教育授了那五个性情。

开卷本文前,倘若对上述的概念不是很清楚,希望先读书那一个小说。

因为,这一篇,大家会组成着具有内容,讲讲实行上下文的现实性管理进度。

深深种类

JavaScript深远连串目录地址:。

JavaScript深刻类别预计写十五篇左右,目的在于帮我们捋顺JavaScript底层知识,入眼教学如原型、作用域、施行上下文、变量对象、this、闭包、按值传递、call、apply、bind、new、传承等难题概念。

借使有不当也许不严慎的地点,请务必给予指正,十三分感激。假设喜欢依旧具备启发,迎接star,对小编也是一种督促。

本系列:

  1. JavaScirpt 深刻之从原型到原型链
  2. JavaScript
    深入之词法成效域和动态功效域
  3. JavaScript 深切之施行上下文栈
  4. JavaScript 深切之变量对象
  5. JavaScript 深刻之功能域链
  6. JavaScript 深切之从 ECMAScript 标准解读
    this

    1 赞 收藏
    评论

澳门太陽城集团登录网址 1

JavaScript 深远之实施上下文

2017/05/18 · JavaScript
·
执行上下文

初稿出处: 冴羽   

驷不如舌参照

《一道js面试题引发的怀想》

本文写的太好,给了自家无数启示。谢谢不尽!

You may also like...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图