JavaScript中如何执行上下文和堆栈

  介绍

小编给大家分享一下JavaScript中如何执行上下文和堆栈,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!

<强>什么是执行上下文?

JavaScript的执行环境非常重要,当JavaScript代码在行时,会被预处理为以下情况之一:

<李>

全球代码——首次执行代码的默认环境。

<李>

函数代码——每当执行流程进入函数体时。

<李>

Eval代码——要在Eval函数内执行的文本。

你可以阅读大量涉及作用域的在线资料,不过为了使事情更容易理解,让我们将术语“执行上下文“视为当前代码的运行环境或作用域。接下来让我们看一个包含全球和功能/当地上下文的代码示例。

 JavaScript中如何执行上下文和堆栈

这里没有什么特别之处,我们有一个由紫色边框表示的全局上下文,和由绿色,蓝色和橙色边框表示的3个不同的函数上下文。只能有1个全局上下文,可以从程序中的任何其他上下文访问。

你可以拥有任意数量的函数上下文,并且每个函数调用都会创建一个新的上下文,从而创建一个私有作用域,其中无法从当前函数作用域外直接访问函数内部声明的任何内容。在上面的示例中,函数可以访问在其当前上下文之外声明的变量,但外部上下文无法访问在其中声明的变量或函数。为什么会这样呢?这段代码究竟是如何处理的?

<强>执行上下文堆栈(执行上下文堆栈)

浏览器中的JavaScript解释器被实现为单个线程。实际上这意味着在浏览器中一次只能做一件事,其他动作或事件在所谓的执行堆栈中排下队。图是单线程堆栈的抽象视图:

 JavaScript中如何执行上下文和堆栈

我们已经知道,当浏览器首次加载脚本时,它默认进入全局上下文执行。如果在全局代码中调用函数,程序的顺序流进入被调用的函数,创建新的执行上下文并将其推送到执行堆栈的顶部。

如果在当前函数中调用另一个函数,则会发生同样的事情。代码的执行流程进入内部函数,该函数创建一个新的执行上下文,该上下文被推送到现有堆栈的顶部。浏览器将始终执行位于堆栈顶部的当前执行上下文,并且一旦函数执行完当前执行上下文后,它将从栈顶部弹出,把控制权返回到当前栈中的下一个上下文。下面的示例显示了递归函数和程序的执行堆栈:

(function  foo (i), {   if (小姐:===,3),{   返回;   }   else  {   foo (+ + i);   }   }(0));

 JavaScript中如何执行上下文和堆栈

代码简单地调用自身3次,并将我的值递增1。每次调用函数foo时,都会创建一个新的执行上下文。一旦上下文完成执行,它就会弹出堆栈并且讲控制返回到它下面的上下文,直到再次达到全局上下文。
关于执行堆栈执行堆栈有5个关键要点:

<李>

单线程。

<李>

同步执行。

<李>

一个全局上下文。

<李>

任意多个函数上下文。

<李>

每个函数调用都会创建一个新的执行上下文执行上下文,甚至是对自身的调用。

<>强执行上下文的细节

所以我们现在知道每次调用一个函数时,都会创建一个新的执行上下文。但是,在JavaScript解释器中,对执行上下文的每次调用都有两个阶段:

1。创建阶段(调用函数时,但在执行任何代码之前):

<李>

创建作用域链。

<李>

创建变量,函数和参数。

<李>

确定“这”的值。

2。激活/代码执行阶段:

<李>

分配值,引用函数和解释/执行代码。

可以将每个执行上下文在概念上表示为具有3个属性的对象:

executionContextObj =, {   & # 39;scopeChain& # 39;:, {,/* variableObject  +,所有父执行上下文的variableObject  */,},   & # 39;variableObject& # 39;:,{,/*函数实参和形参,内部变量和函数声明,*/,},   & # 39;这个# 39;:,{}   }

JavaScript中如何执行上下文和堆栈