Javascript 为什么在javascript匿名函数的末尾写“.call(this)”？

Why write ".call(this)" at the end of an javascript anonymous function?

提问by zod

I have seen JavaScript written like this (it was at a demonstration, and I don't have the actual code at hand, but it was implied this was normal):

我见过这样写的 JavaScript（这是在演示中，我手头没有实际代码，但暗示这是正常的）：

(function() {    

    var a = 1;

    this.sayA = function() {
        alert(a);
    }

}).call(this);

sayA();

I suppose it is written an an anonymous function so that the variable ais not globally available.

我想它是一个匿名函数，因此该变量a不是全局可用的。

What could the point of the .call(this)be? Since this function was not nested, thiswas just the window. How does it differ from just writing ()at the end?

重点.call(this)是什么？由于此函数未嵌套，this因此只是窗口。它与只写()在最后有什么不同？

采纳答案by Yoshi

Try this:

尝试这个：

function Foo() {

  (function () {
    console.log(this);
    // > Foo
  }).call(this);

  (function () {
    console.log(this);
    // > undefined in strict mode, or Window in non strict mode
  })();
}

var bar = new Foo;

So, if for whatever reason you use this, it's a way to make the IIFEact as if it were a member function of Foo, specifically when creating instances of a user-defined object type.

因此，无论出于何种原因使用它，它都是一种使IIFE充当 的成员函数的方法Foo，特别是在创建用户定义的对象类型的实例时。

回答by netpoetica

I was curious about this as well as I had just seen John Resig's talk about this video. Yoshi had a great answer but I had to test it in a bit in console log to understand and I thought this modification to his answer might help some people who were having trouble at first like me:

我对此很好奇，因为我刚刚看到 John Resig 谈论这个视频。Yoshi 有一个很好的答案，但我必须在控制台日志中稍微测试一下才能理解，我认为对他的答案的这种修改可能会帮助一些像我这样起初遇到麻烦的人：

function Foo() {
  this.foo = true;
  (function () {
      console.log("Foo = " + this.foo);
      // Outputs undefined
  }());
  (function () {
      console.log("Foo = " + this.foo);
      // Outputs true
  }).call(this);

  (function () {
      console.log(this);
      // Outputs undefined in strict mode, or Window in non strict mode
      // Anonymous functions usually default to the global scope
  })();
}

var bar = new Foo;

It just made a little more sense to me to see the first and second ones side by side, showing that .call(this) essentially gives you the ability to pass the current context to an anonymous function.

将第一个和第二个并排显示对我来说更有意义，这表明 .call(this) 本质上使您能够将当前上下文传递给匿名函数。

Thanks for the question and thanks Yoshi for the clear answer!

感谢您的提问，也感谢 Yoshi 的明确回答！

回答by Bergi

Since this function was not nested, thiswas just the window. How does it differ from just writing ()at the end?

由于此函数未嵌套，this因此只是窗口。它与只写()在最后有什么不同？

No - not in strict mode:

否 - 不在严格模式下：

1. If the function code is strict code, set the ThisBindingto thisArg.
2. Elseif thisArgis nullor undefined, set the ThisBindingto the global object.
3. …

1. 如果函数代码是严格代码，则设置ThisBinding为thisArg。
2. 否则，如果thisArg是null或undefined，则将 设置ThisBinding为全局对象。
3. …

In strict mode, the thisis just directly set to the given value, which is undefinedfor a normal call. Therefore, .call(this)is used to pass the global object explicitly in. You can try this in the console:

在严格模式下，this只是直接设置为给定值，undefined用于正常调用。因此，.call(this)用于显式传递全局对象。您可以在控制台中尝试：

> (function() { "use strict"; console.log(this); })()
undefined
> (function() { "use strict"; console.log(this); }).call(this)
Window

It might not make a difference for sloppy code, but it's a good practise and future-compatible :-)

对于草率的代码，它可能没有什么不同，但这是一个很好的做法，并且与未来兼容 :-)

回答by Jakub Konecki

thispassed to the function sets the context of the execution, so inside your anonymous function thisrefers to the window.

this传递给函数设置执行的上下文，因此在您的匿名函数内部this引用window.

You can than write this.alert('');.

你可以比写this.alert('');。