javascript - 在Javascript中，为什么 "this"运算符不一致？

Question

在 JavaScript 中，“this”运算符在不同场景下可以指代不同的事物。

通常在 JavaScript“对象”内的方法中，它指的是当前对象。

但是当用作回调时，它变成对调用对象的引用。

我发现这会导致代码出现问题，因为如果您使用 JavaScript“对象”中的方法作为回调函数，您无法判断“this”是否引用当前“对象”或“this”引用调用对象。

有人可以澄清有关如何解决此问题的用法和最佳实践吗？

   function TestObject() {
            TestObject.prototype.firstMethod = function(){
                      this.callback();
                      YAHOO.util.Connect.asyncRequest(method, uri, callBack);

            }

            TestObject.prototype.callBack = function(o){
              // do something with "this"
              //when method is called directly, "this" resolves to the current object
              //when invoked by the asyncRequest callback, "this" is not the current object
              //what design patterns can make this consistent?
              this.secondMethod();
            }
            TestObject.prototype.secondMethod = function() {
             alert('test');
            }
        }

Answer 1

在我喋喋不休地谈论神奇的 this 变量之前，请快速提供有关最佳实践的建议。如果您希望 Javascript 中的面向对象编程 (OOP) 能够紧密反射(reflect)更传统/经典的继承模式，请选择一个框架，了解其怪癖，并且不要试图变得聪明。如果您想变得聪明，请将 javascript 作为一种函数式语言来学习，并避免考虑类之类的事情。

这提出了关于 Javascript 需要记住的最重要的事情之一，并在没有意义时对自己重复一遍。 JavaScript 没有类。如果某个东西看起来像一个类，那么这是一个聪明的技巧。 Javascript 有对象(不需要 mock 的引号)和函数。 (这不是 100% 准确，函数只是对象，但有时将它们视为单独的事物会有所帮助)

this 变量附加到函数上。每当您调用函数时，this 都会被赋予一定的值，具体取决于您调用该函数的方式。这通常称为调用模式。

JavaScript 中有四种调用函数的方法。您可以将函数作为方法、函数、构造函数以及apply来调用。

作为一种方法

方法是附加到对象的函数

var foo = {};
foo.someMethod = function(){
    alert(this);
}

当作为方法调用时，this 将绑定(bind)到该函数/方法所属的对象。在此示例中，这将绑定(bind)到 foo。

作为函数

如果您有一个独立的函数，this 变量将绑定(bind)到“全局”对象，几乎总是浏览器上下文中的window 对象。

 var foo = function(){
    alert(this);
 }
 foo();

这可能是让您绊倒的原因，但不要感到难过。许多人认为这是一个糟糕的设计决策。由于回调是作为函数而不是方法调用的，因此您会看到看似不一致的行为。

许多人通过做类似这样的事情来解决这个问题

var foo = {};
foo.someMethod = function (){
    var that=this;
    function bar(){
        alert(that);
    }
}

您定义一个变量that，它指向this。闭包(它自己的一个主题)保留了 that，因此如果您将 bar 作为回调调用，它仍然有一个引用。

作为构造函数

您还可以调用函数作为构造函数。根据您使用的命名约定 (TestObject)，这也可能是您正在做的事情，也是困扰您的原因。

您可以使用 new 关键字将函数作为构造函数调用。

function Foo(){
    this.confusing = 'hell yeah';
}
var myObject = new Foo();

当作为构造函数调用时，将创建一个新对象，并且 this 将绑定(bind)到该对象。同样，如果您有内部函数并且它们被用作回调，您将把它们作为函数调用，并且 this 将绑定(bind)到全局对象。使用 var that = this; 技巧/模式。

有些人认为 constructor/new 关键字是扔给 Java/传统 OOP 程序员的一 block 骨头，作为创建类似于类的东西的一种方式。

使用Apply方法。

最后，每个函数都有一个名为 apply 的方法(是的，函数是 Javascript 中的对象)。应用可以让您确定 this 的值，还可以让您传递一个参数数组。这是一个无用的示例。

function foo(a,b){
    alert(a);
    alert(b);
    alert(this);
}
var args = ['ah','be'];
foo.apply('omg',args);