在 javascript 的父闭包中引用“this”

Question

我想在 Javascript 中执行此操作：

function Z( f )
{
  f();
}

function A()
{
  this.b = function()
  {
    Z( function () { this.c() } );
  }

  this.c = function()
  {
    alert('hello world!');
  }
}

var foo = new A();
foo.b();

可以这样实现：

function Z( f )
{
  f();
}

function A()
{
  var self = this;
  this.b = function()
  {
    Z( function () { self.c() } );
  }

  this.c = function()
  {
    alert('hello world!');
  }
}

var foo = new A();
foo.b();

有没有更好的办法？

Answer 1

保持对父级的引用（就像您一样）是一种好方法，但是对于您的具体示例，不需要匿名包装器，您可以直接传递函数，如下所示：

var self = this;
this.b = function()
{
  Z(self.c);
}

You can test it out here，如果没有这个包装器，实际上就不需要self 变量，你可以直接使用this，像这样：

this.b = function()
{
  Z(this.c);
}

You can test that version here.

---

由于下面的 cmets 似乎有些混乱，上面的代码维护了this问题，如果你想在回调中也维护this/context，使用.call()like this:

this.b = function()
{
  Z.call(this, this.c);
}

对于Z：

function Z( f )
{
  f.call(this);
}

You can test it here.

Answer 2

你也可以使用

this.b = function()
{
    Z( (function () { this.c() }).apply(this) );
}

Answer 3

有一种通常称为“委托”的模式可以解决这个问题。

在 javascript 中，不太花哨的实现可能如下所示：

/** class Delegate **/
var Delegate = function(thisRef, funcRef, argsArray) {
    this.thisRef=thisRef;
    this.funcRef=funcRef;
    this.argsArray=argsArray;
}
Delegate.prototype.invoke = function() {
    this.funcRef.apply(this.thisRef, this.argsArray);
}
/** static function Delegate.create - convenience function **/
Delegate.create = function(thisRef, funcRef, argsArray) {
    var d = new Delegate(thisRef, funcRef, argsArray);
    return function() {  d.invoke(); }
}

在你的例子中，你会这样使用它：

this.b = function() {
  Z( Delegate.create(this, this.c) );
}

您还可以编写期望接收委托的函数：

function Z( d ) {
    d.invoke();
}

然后，在A 中，您对b 的实现变为：

this.b = function() {
    var d = new Delegate(this, this.c);

    Z( d );
    SomeOtherFunc( d );
}

Delegate 只是提供了一种简单、一致的方式来封装this 引用（您称之为self），该对象实例可以像任何其他对象实例一样处理。它更具可读性，它使您不必使用像self 这样的多余变量来污染您的函数范围。更高级的委托实现可以有自己的方法和其他相关状态。也可以构建委托以帮助最小化一些与范围相关的内存管理问题（尽管我在此处显示的代码绝对不是这样的示例）。