• 技术文章 >web前端 >js教程

    手把手教你理解JS中的执行上下文

    青灯夜游青灯夜游2021-06-02 19:46:03转载192
    本篇文章一步步带你深入理解JavaScript中的执行上下文。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

    只有理解了执行上下文,才能更好地理解 JavaScript 语言本身,比如变量提升,作用域,闭包等

    执行上下文

    执行上下文是当前代码的执行环境。

    执行上下文主要是三种类型:

    每个执行上下文,都有三个重要属性:

    在函数上下文中,使用活动对象 (activation object, AO) 来表示变量对象。活动对象和变量对象其实是一个东西,只有当进入一个执行环境时,这个执行上下文的变量对象才会被激活,此时称为 活动对象(AO),只有活动对象上的属性才能被访问。

    执行上下文的生命周期:创建 -> 执行 -> 回收

    1. 创建阶段:

    1.1 创建变量对象:

    举个简单的例子来理解变量对象

    function getName(name) {
        var b = 2;
        function foo() {};
        var bar = function() {};
    
    }
    getName('lucystar')

    此时的 AO 大致如下

    AO = {
        arguments: {
            0: 'lucystar',
            length: 1
        },
        name: 'lucystar',
        b: undefined,
        foo: reference to function foo(){},
        bar: undefined
    }
    上面例子中涉及到了变量提升和函数提升,之前在 从JS底层理解var、let、const这边文章中也介绍过
    1.2 创建作用域链

    函数的作用域在函数定义的时候就确定了。作用域链本身包含变量对象,当查找变量时,会先从当前上下文中的变量对象中查找,如果没有找到,就会从父级执行上下文的变量对象中查找,一直找到全局执行上下文的变量对象

    1.3 确定this的指向

    这部分又分为多种情况,具体的可以查看另一篇文章 一文理解this&call&apply&bind

    2. 执行阶段

    执行变量赋值,代码执行

    3. 回收阶段

    执行上下文出栈被垃圾回收机制进行回收。关于内存回收的内容,可以查看 V8内存管理及垃圾回收机制

    执行上下文栈

    执行上下文栈是用来管理执行上下文的。在执行上下文创建好后,JavaScript引擎会将执行上下文压入到栈中,通常把这种用来管理执行上下文的栈称为执行上下文栈,又称调用栈。

    let a = 'javascript';
    
    function foo() {
        console.log('foo');
        bar();
    }
    function bar() {
        console.log('bar');
    }
    foo();

    1.png

    为什么基本数据类型存储在栈中,引用数据类型存储在堆中?JavaScript引擎需要用栈来维护程序执行期间的上下文的状态,如果栈空间大了的话,所有数据都存放在栈空间里面,会影响到上下文切换的效率,进而影响整个程序的执行效率。

    更多编程相关知识,请访问:编程视频!!

    以上就是手把手教你理解JS中的执行上下文的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:segmentfault,如有侵犯,请联系admin@php.cn删除
    上一篇:Math.max()不带参数会返回什么?为什么? 下一篇:深入了解TypeScript中的5种设计模式
    第16期线上培训班

    相关文章推荐

    • JavaScript怎么实现打印操作• JavaScript中解析parseInt()的怪异行为• javascript怎么删除html• 聊聊JavaScript中eval()函数的用法• 浅谈JavaScript中的事件委托• JavaScript中如何更好地使用数组

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网