嵌套函数中的函数上下文("this")

Question

当您在Javascript中调用顶级函数时,函数内的this关键字引用默认对象(如果在浏览器中则为窗口).我的理解是,这是一个调用函数作为方法的特殊情况,因为默认情况下它是在窗口上调用的(如John Resig的书中所述,JavaScript忍者的秘密,第49页).实际上,以下代码中的两个调用都是相同的.

function func() {
  return this;
}

// invoke as a top-level function
console.log(func() === window); // true

// invoke as a method of window
console.log(window.func() === window); // true

到目前为止一切都很好......现在这是我不理解的部分:

当函数嵌套在另一个函数中并在未指定要调用的对象的情况下调用时,函数内的this关键字也指向window.但是不能在窗口上调用内部函数(参见下面的代码).

function outerFunc() {
  function innerFunc() {
    return this;
  }

  // invoke without window.* - OK
  console.log(innerFunc() === window); // true

  // invoke on window
  //window.innerFunc(); - error (window has no such method)
  console.log(window.innerFunc) // undefined
}

outerFunc();

完全合理的是嵌套函数在窗口上不可用,因为它是在所有嵌套之后......但是我不明白为什么this关键字引用窗口,就好像在窗口上调用了函数一样.我在这里错过了什么？

编辑

以下是对以下优秀答案的总结以及我的一些后续研究.

• 调用函数"正常"与调用它作为窗口方法相同是不正确的.只有在全局定义函数时,这才是正确的.

• 函数上下文(this关键字的值)不依赖于函数的定义位置和方式,而是取决于函数的调用方式.

• 假设代码没有以严格模式运行,则"正常"调用函数将把函数上下文设置为window(在浏览器中运行时,或者在其他环境中运行相应的全局对象).

• 上述规则的一个例外是使用bind来创建一个函数.在这种情况下,即使该函数被"正常"调用,它也可能具有窗口以外的上下文.也就是说,在这种情况下,上下文由您创建函数的方式决定,而不是如何调用它.虽然严格来说这不准确,因为bind会创建一个新函数,使用apply在内部调用给定函数.新函数的上下文仍将由它调用的方式决定,但它通过使用apply来屏蔽它内部调用的函数的上下文.

通过调用"normal"我引用以下简单的调用方式:

myFunction();

为了完成图片,这里简要介绍了其他调用方式和相应的上下文:

• 作为对象(方法)的属性 - 上下文是对象

• 使用apply或call - 显式指定上下文

• 使用new运算符(作为构造函数) - 上下文是新创建的对象

为了类似问题的人的利益,请随时根据需要更新上述内容.谢谢!

Answer 1

您可以调用 范围内的任何函数functionName()。由于您尚未在对象上调用它，因此它将在默认对象 ( ) 的上下文中调用window。undefined（IIRC，如果您处于严格模式，则会在上下文中调用它）。

上下文的默认对象与函数的定义位置或函数出现的范围无关。它只是默认对象。

如果函数是对象的属性，则可以将其称为，并且它将在 的上下文中而不是默认对象reference.to.object.function()中调用。object

其他改变上下文的东西是new关键字和apply、call、 和bind方法。