“调用上下文”和“执行上下文”在javascript中：我们在谈论同样的事情吗？ [英] "Invocation context" and "execution context" in javascript: are we talking of the same thing?

问题描述

有时我读调用上下文有时候是执行上下文。我想知道我们是否在讨论相同的概念。

Sometimes I read "invocation context" sometimes "execution context". I would like to know if we are talking about the same concept.

我必须说在ECMAScript6规范中我没有找到任何对调用上下文的引用。

I must say that in ECMAScript6 specification I don't find any reference to the "invocation context".

推荐答案

这两个术语密切相关，但不是同样的事情。

简而言之，他们定义范围与上下文。范围是关于代码运行的环境和context是关于导致某些代码被执行的实际对象。

The two terms are closely related but not the same thing.

In a nutshell they define scope vs. context. Scope is about the environment that code runs in and context is about an actual object that caused some code to be executed.

执行上下文是指 范围链 即
效果运行某些代码时。范围链是
内存位置的列表，应该检查（按特定顺序）
标识符（变量，常量和函数名称），以便将值解析为
。由于JavaScript是在单线程
环境中执行的，因此一次只能执行一个任务。当前
执行代码（及其相关范围）定义执行
上下文。

An "execution context" refers to the "scope chain" that is in effect when some code is running. A scope chain is a list of memory locations that should be checked (in a particular order) for identifiers (variable, constant and function names) to be resolved to a value. Since JavaScript is executed in a single-threaded environment, only one task can be executed at a time. The currently executing code (and its associated scope) define the execution context.

一个简单的例子可以如下所示：

A simple example can be shown like this:

// This area is in the Global execution context (scope) because the code is 
// not wrapped in a function or any other kind of code block.
var x = "Global";

// "Global" is the result because the JavaScript engine will always look
// in the current scope for a declaration for the identifier in question.
// It will find a declaration for "x" right here in the Global scope, so
// that's the value it will use.
console.log(x); 

var y = "Also Global";

function parent(){
   // This area is in the "parent" execution context (scope)
   var x = "parent";

   // "parent" is the result (not "Global") because when this function is
   // executing, its scope is the most accessible. The JavaScript engine
   // looks here first to find out what "x" is:
   console.log(x); 

   function child() {
      // This area is in the "child" execution context (scope)
      var x = "child";

      // "child" is the result (not "Global" or "parent") because when this 
      // function is executing, its scope is the most accessible. The 
      // JavaScript engine looks here first to find out what "x" is:
      console.log(x); 

      // "Also Global" is the result here. First the current execution
      // context (scope) is checked for a "y" variable. There isn't one,
      // so the next scope in the scope chain (function parent) is checked.
      // There is no "y" declared there either. So, again, the next highest
      // scope in the chain (Global) is checked and that is where "y" is
      // found, so the value of that "y" is used.
      console.log(y);

      // Here, we will get "undefined". All the scopes in the chain will
      // be checked and if we go all the way up to Global and still don't
      // find a declaration for "z", there is no other scope to look in.
      console.log(z);
   }
}

显示三个执行上下文（范围）以上可以通过各种方式进行。这些不同的方式产生了调用上下文。

调用上下文也可以更准确地称为
调用上下文对象，它指的是用于调用某些代码的
的对象 。这可能看起来与
执行上下文相同，但调用上下文指的是
对象，它导致代码执行并且执行代码正在执行所以
在它自己的执行上下文（范围）内。

An "invocation context" can also more accurately be called an "invocation context object" which refers to the object that was used to invoke some code. This may seem like the same thing as the "execution context", but the "invocation context" refers to the object that leads to code executing and that executing code is doing so within its own execution context (scope).

这两个术语之间最大的区别在于理解调用context导致在执行上下文期间将关键字 this 绑定到对象。 此绑定在JavaScript中是易失性的，并且<* c $ c>此绑定到的对象在您进入新执行时可能会发生变化上下文。对于所有意图和目的，此 是调用某些代码的对象，或此是调用上下文。

The biggest differentiating point between these two terms is understanding that the invocation context leads to the binding of the keyword this to an object for the duration of the execution context. this binding is volatile in JavaScript and the object that this binds to is subject to change as you enter into a new execution context. For all intents and purposes, this is the object that invoked some code, or this is the "invocation context".

我写了另一个答案，详细介绍了如何确定这个将绑定，您可以看到 此处 。

I've written another answer that goes into more detail about how to determine what this will bind to and you can see that here.

有关调用上下文的说明，请参阅以下代码段。它说明了一个 执行上下文（ function foo ），但两个 调用上下文（按钮和全局）。

See the following snippet for an explanation of invocation context. It illustrates one execution context (function foo), but two invocation contexts (the button and Global).

function foo() {
  // When this function is "invoked" via the button click
  // the invocation context is the button and the console will
  // log this as: [object HTMLButtonElement]
  
  // But, when the function is invoked from a direct call to foo
  // from the Global execution context, this will be bound
  // to the window object. So, in that case we'll get: [object Window]
  console.log("The 'this' object (invocation context object) is: " + this);
}

// Call foo from the Global execution context.
foo();

var btn = document.getElementById("btnTest");

// When the button is clicked, execute foo
btn.addEventListener("click", foo);

<button id="btnTest">Click Me</button>

这篇关于“调用上下文”和“执行上下文”在javascript中：我们在谈论同样的事情吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！