javascript代码怎么执行 javascript执行函数
在本文中，我将深入探讨 javascript 中一个基本概念——执行上下文。通过阅读这篇文章，你将能够清楚地理解 js 解释器的工作原理，可以为什么某些函数和声明变量使用它们，以及它们的取值是如何确定的。
什么是执行上下文（Execution Context）？当 JavaScript 代码运行时，它存在的执行环境非常重要，通常分为以下几种：全局代码（Global） code）——默认环境，代码首先执行的地方。函数代码（函数代码）——当代码执行进入函数时体。Eval代码（Eval代码）——在eval函数内部执行的文本。
网上有很多关于作用域的文章，论文的目的是让我们更容易地理解这些概念。让想象一下执行上下文这个术语就是当前代码的执行环境/作用域。废话再说，让我们看一个代码在全局和函数/局部执行域的例子。
这里没有什么特别的地方，我们有一个全局外围（用红色标注）和三个不同的函数外围（分别用绿色、蓝色、橙色标注）。只有一个全局上下文，并且可以被程序中的其他外围访问。
你可以有多个函数上下文，每次函数调用都会创建一个新的上下文创建，并一个局部作用域，作用域内部声明的任何都不能被当前函数作用域外部访问。在上面的例子中，函数可以访问到当前上下文外部声明的变量，反之则不行。这是为什么呢？这些代码是如何执行的？
立即学习“Java免费学习笔记（深入）”；
执行上下文栈（Execution） Context Stack）在浏览器中的 JavaScript 解释器是单线程的。这意味着在浏览器中一次下面只会发生一件事，其他或事件行为会在所谓的执行栈中排队等待。的图标是单线程栈的一个抽象表示：
我们已经知道，浏览器第一次加载脚本时，它会默认进入全局执行上下文。如果你在全局环境中调用了一个函数，程序序列流会进入被调用的函数中，创建一个新的执行上下文并将其压入执行栈中。
如果你在当前函数中又调用了另一个函数，同样会发生同样的事情。的执行流进入它内部函数，这将创建一个新的执行上下文，它被压入现有栈的顶部。浏览器总是会执行当前栈顶的执行上下文。一旦函数在当前执行上下文中执行完毕，就会被从栈顶弹出，然后将控制权转移到当前栈的下一个上下文。下面的代码显示了一个相邻函数以及程序的执行上下文：(function foo(i) { if (i === 3) { return； } else { foo( i)； }}(0))；登录后复制
becode 代码会调用自身三次，每次将 i 的值增加 1。 被调用时，都会创建一个新的执行上下文。一旦上下文执行结束，它就会从栈中弹出控制权返回给下上下文，直到全局上下文再次被访问。
关于执行上下文，有五个要点需要记住：单线程。同步执行。只有一个全局上下文。可以有无数个函数上下文。每个函数都会创建一个新的执行上下文，即使是调用。
执行上下文的细节现在我们已经知道每个函数都会创建一个新的执行上下文了。
然而，在 JavaScript 解释器内部，每个执行上下文的调用都会经历两个阶段：创建阶段（当函数被调用，但内部代码尚未开始执行）：创建作用域链。变量、函数和参数。决定 "this" 的值。激活/代码执行阶段：声明，寻找函数引用以及解释/执行代码。
可以用一个具有三个属性的概念性对象来代表执行：executionContextObj = { 'scopeChain'： { /* 变量对象所有父级执行上下文中的变量对象 */ }， 'variableObject'： { /* 函数参数/参数，内部变量以及函数声明 */ }， 'this'： {}}登录后复制
活动对象/变量对象（AO/VO）这个executionContextObj对象在函数调用时创建，但在函数真正执行之前。这就是我们所说的第1条 在这个阶段，解释器通过扫描格式化函数的参数、局部函数声明和局部变量声明来创建executionContextObj对象。这个扫描的结果就变成了executionContextObj中的variableObject。
对象解释器这是执行代码时的伪概述：寻找调用函数的代码。在执行函数代码创建，执行前面之前。进入创建阶段段：初始化作用域链。创建变量对象：创建参数对象，检查参数的上下文，其初始化名称和值并创建一个引用拷贝。扫描上下文中的函数声明：对于每个发现的函数，在变量对象中一个与函数名同名的属性创建，这是函数在内存中的引用。如果函数名已经存在，存在引用值将被覆盖。扫描上下文中的变量声明：对于每个发现的变量声明，在变量对象中一个创建同名属性并初始化值undefined。如果变量名在变量对象中已经存在，什么都不做，继续扫描。确定上下文中的“this”。激活/代码执行阶段：执行/在上下文中解释函数代码，并在代码中逐行执行时给变量赋值。
让我们看一个例子：函数foo(i) { var a = 'hello'； var b = function privateB() { }； function c() { }}foo(22)；登录后复制
在调用 foo(22) 时，创建场景如下：fooExecutionContext = {scopeChain： { ... }，variableObject： {args：{ 0： 22， length： 1 }， i： 22， c： 指向函数 c() 的指针 a： undefined， b： undefined }， this： { ... }}登录后复制
你可以发现，创建阶段负责定义属性名，而不是给它们赋值，不过参数接着。一旦创建阶段完成之后，执行流就会进入函数中。
在函数执行完成之后，激活/代码执行阶段看起来是这样的：fooExecutionContext = {scopeChain： { ... }，variableObject：{arguments：{ 0： 22， length： 1 }， i： 22， c： 指向函数 c() 的指针 a： 'hello'， b： 指向函数 privateB() }， this： { ... }} 登录后复制
关于提升（Hoisting）网上有很多关于 JS 的内容中提升这个术语的信息，用来解释变量和函数声明被“提升”到它们的函数作用域顶部的机制。然而，这些都没有详细解释为什么会发生这样的事情。用你刚刚学到的新知识，关于解释器创建活动对象，很容易就能理解。看下面的这个例子：(function() { console.log(typeof foo)； // 函数指针 console.log(typeof bar)； // undefined var foo = 'hello'， bar = function() { return 'world'； }； function foo() { return 'hello'； }}())；登录后复制
这些问题我们现在能回答了：为什么在 foo 声明我们可以访问它？遵循创建阶段，我们在激活/执行代码阶段之前，变量就被创建了。所以当函数被执行时，foo 已经在活动对象中定义了。Foo 被显示了两次，为什么最后它是 function 而之前不是 undefined 或 string？被声明了两次，但从创建阶段我们知道函数在变量之前被创建在活动对象中，并且如果属性名已经于活动对象中，重复声明会被忽略。未定义。
总结希望你现在已经理解了 JavaScript 解释器是如何执行你的代码。理解执行上下文和调用栈能够让你清楚地知道为什么你的代码执行时得到的结果与你预想的不一样。
你认为了解 JS 解释器的内部工作原理是多余的，还是对你的 JavaScript 知识非常有帮助？了解执行上下文的阶段能帮助你更好地编写 JavaScript代码吗？
注：有人曾问我关于闭包、回调函数、定时器等问题，我会在下一篇文章中阐述，阅读作用域链了解更多与执行上文有关的内容。
文章以上就是JavaScript栈中的执行上面和调用更多相关的内容是什么，详细请关注乐哥常识网其他相关！