在 JavaScript 原型函数中保留对“this”的引用[重复]

我刚刚开始使用原型 JavaScript，但在弄清楚如何保存this当作用域发生变化时，从原型函数内部引用主对象。让我解释一下我的意思（我在这里使用 jQuery）：

MyClass = function() {
  this.element = $('#element');
  this.myValue = 'something';

  // some more code
}

MyClass.prototype.myfunc = function() {
  // at this point, "this" refers to the instance of MyClass

  this.element.click(function() {
    // at this point, "this" refers to the DOM element
    // but what if I want to access the original "this.myValue"?
  });
}

new MyClass();

我知道我可以通过在开始时执行此操作来保留对主对象的引用myfunc:

var myThis = this;

然后使用myThis.myValue访问主对象的属性。但是当我有一大堆原型函数时会发生什么MyClass？我必须保存参考吗this在每一个的开头？似乎应该有一种更清洁的方法。那么像这样的情况又如何呢：

MyClass = function() {
  this.elements $('.elements');
  this.myValue = 'something';

  this.elements.each(this.doSomething);
}

MyClass.prototype.doSomething = function() {
  // operate on the element
}

new MyClass();

在这种情况下，我无法使用以下命令创建对主对象的引用var myThis = this;因为即使是原来的值this在上下文中doSomething is a jQuery对象而不是一个MyClass object.

有人建议我使用全局变量来保存对原始变量的引用this，但这对我来说似乎是一个非常糟糕的主意。我不想污染全局命名空间，这似乎会阻止我实例化两个不同的MyClass物体之间互不干扰。

有什么建议么？有没有一种干净的方法来做我想要的事情？或者我的整个设计模式有缺陷吗？

为了保留上下文，bind方法确实有用，它现在是最近发布的一部分ECMAScript 第五版 http://www.ecma-international.org/publications/standards/Ecma-262.htm规范来说，这个函数的实现很简单（只有8行长）：

// The .bind method from Prototype.js 
if (!Function.prototype.bind) { // check if native implementation available
  Function.prototype.bind = function(){ 
    var fn = this, args = Array.prototype.slice.call(arguments),
        object = args.shift(); 
    return function(){ 
      return fn.apply(object, 
        args.concat(Array.prototype.slice.call(arguments))); 
    }; 
  };
}

你可以在你的例子中使用它，如下所示：

MyClass.prototype.myfunc = function() {

  this.element.click((function() {
    // ...
  }).bind(this));
};

另一个例子：

var obj = {
  test: 'obj test',
  fx: function() {
    alert(this.test + '\n' + Array.prototype.slice.call(arguments).join());
  }
};

var test = "Global test";
var fx1 = obj.fx;
var fx2 = obj.fx.bind(obj, 1, 2, 3);

fx1(1,2);
fx2(4, 5);

在第二个例子中，我们可以更多地观察到bind.

它基本上生成一个新函数，它将负责调用我们的函数，保留函数上下文（this值），定义为第一个参数bind.

其余的参数只是传递给我们的函数。

请注意，在此示例中，该函数fx1, 被调用时没有任何对象上下文 (obj.method())，就像一个简单的函数调用一样，在这种类型的调用中，this里面的关键字将引用 Global 对象，它会提醒“global test”。

现在fx2是新函数bind生成的方法，它将调用我们的函数，保留上下文并正确传递参数，它会警告“obj test 1, 2, 3, 4, 5”，因为我们调用它添加了两个附加参数，它已经有了binded前三个。