首页 > 编程语言 >3.理解JavaScript的执行上下文、执行上下文栈,可以应用堆栈信息快速定位问题

3.理解JavaScript的执行上下文、执行上下文栈,可以应用堆栈信息快速定位问题

时间:2023-03-04 12:11:53浏览次数:33  
标签:执行 函数 定位问题 JavaScript 创建 全局 上下文 变量

1.执行上下文

执行上下文就是当前 JavaScript 代码被解析和执行时所在环境的抽象概念, JavaScript 中运行任何的代码都是在执行上下文中运行

1.执行上下文的类型

  • 全局执行上下文:她做了两件事:①创建了一个全局对象,在浏览器中就是window对象②将this指针指向这个全局对象。一个程序只能存在一个全局执行上下文
  • 函数执行上下文:记住只有调用的时候才会创建函数执行上下文。一个程序中可以存在任意数量的函数执行上下文。每当一个新的执行上下文被创建,它都会按照特定的顺序执行一系列步骤
  • eval函数执行上下文:一个程序中可以存在任意数量的函数执行上下文。每当一个新的执行上下文被创建,它都会按照特定的顺序执行一系列步骤

2.执行上下文的生命周期

1.创建阶段

当函数被调用,但未执行任何其内部代码之前,会做以下三件事:

  • 创建变量对象:首先初始化函数的参数 arguments,提升函数声明和变量声明。下文会详细说明。
  • 创建作用域链(Scope Chain):在执行期上下文的创建阶段,作用域链是在变量对象之后创建的。作用域链本身包含变量对象。作用域链用于解析变量。当被要求解析变量时,JavaScript 始终从代码嵌套的最内层开始,如果最内层没有找到变量,就会跳转到上一层父作用域中查找,直到找到该变量。
  • 确定 this 指向:包括多种情况,下文会详细说明

在一段 JS 脚本执行之前,要先解析代码(所以说 JS 是解释执行的脚本语言),解析的时候会先创建一个全局执行上下文环境,先把代码中即将执行的变量、函数声明都拿出来。变量先暂时赋值为 undefined,函数则先声明好可使用。这一步做完了,然后再开始正式执行程序。

另外,一个函数在执行之前,也会创建一个函数执行上下文环境,跟全局上下文差不多,不过 函数执行上下文中会多出 this arguments 和函数的参数。

2.执行阶段

执行变量赋值、代码执行

3.回收阶段

执行上下文出栈等待虚拟机回收执行上下文

3.确定this指向

 this 的值是在执行的时候才能确认,定义的时候不能确认!

4.执行上下文栈

那么多函数执行上下文,自然需要执行上下文栈,遵循先进后出

关键点:

  • js是单线程,所有的代码都是排队执行
  • 一开始执行,首先创建全局的执行上下文,压入执行栈的顶部
  • 每当进入一个函数的执行就会创建一个函数的执行上下文,并且把他压入栈的顶部,当前函数执行完成后,当前函数的执行上下文出栈,并等待垃圾回收。
  • 浏览器的 JS 执行引擎总是访问栈顶的执行上下文
  • 全局上下文只有唯一的一个,它在浏览器关闭时出栈

 

标签:执行,函数,定位问题,JavaScript,创建,全局,上下文,变量
From: https://www.cnblogs.com/alwaysrun/p/17178039.html

相关文章

  • 2.理解JavaScript的作用域和作用域链
    什么是作用域Javascript中的作用域说的是变量的可访问性和可见性。也就是说整个程序中哪些部分可以访问这个变量,或者说这个变量都在哪些地方可见。作用域的类型全局作......
  • JavaScript中Date对象
    当我们收到甲方的需求,要做一个类似于商城之类的项目的时候,JS的Date对象就至关重要了.因为在商城中,各种优惠和折扣,就需要在一个时间的紧迫下,才能达到一个火爆的效果,......
  • JavaScript——快速判断数组对象的值是否全部满足条件
    前言EasyBe主题开发中遇到一个问题,查看了下MDN文档找到了比较合适的方法,这里只做了简单的示例,详细的一些描述和原理建议访问MDN进行查看;every:everysome:some内容ev......
  • JavaScript中的Date
    得到本地时间,在不同时区打印newDate(),输出的结果将会不一样:newDate(); 得到本地时间距1970年1月1日午夜(GMT时间)之间的毫秒数:newDate().getTime(); 返......
  • 关于Javascript——Promise的一些理解
    Promise是一个构造函数,promise是通过Promise构造函数声明的对象。 promise对象用来“管理”一次异步任务。 通过newPromise()声明一个promise对象的时候需要传两个参......
  • 如何在 JavaScript 中使用媒体查询
    前言说起媒体查询想必大家最先想到的都是CSS中@media,没错,这是我们最常用的媒体查询方法,主要用来为我们的网站做适配处理。比如:h1{font-size:2rem;color:green;......
  • JavaScript模块化理解-CommonJS、AMD、CMD、UMD、ES6
    参考:JavaScript模块化-CommonJS、AMD、CMD、UMD、ES6前端模块化——彻底搞懂AMD、CMD、ESM和CommonJS 在JS早期,使用script标签引入JS,会造成以下问题:加载的时候阻塞......
  • How to make an HTTP request in Javascript?
    YoucanmakeanHTTPrequestinJavaScriptusingthebuilt-infetch()functionortheXMLHttpRequest(XHR)object.Hereareexamplesofhowtouseeachofthes......
  • 【C#异步】异步多线程的本质,上下文流转和同步
    引言net同僚对于async和await的话题真的是经久不衰,这段时间又看到了关于这方面的讨论,最终也没有得出什么结论,其实要弄懂这个东西,并没有那么复杂,简单的从本质上来......
  • why is the setInterval task executed slower than the setTimeout task in the brow
    whyisthesetIntervaltaskexecutedslowerthanthesetTimeouttaskinthebrowserjavascriptenvironment?为什么在浏览器javascript环境下setInterval任务......