javascript绑定对象's原型函数

javascript binding object's prototype function

本文关键字:原型 函数 绑定 对象 javascript      更新时间:2023-09-26

如何将对象原型中的this指针绑定到对象的实例?

function Foo(){ }
Foo.prototype.f1 = function(){this.f2();} //is wrong because 'this' does not refer to Foo instance
Foo.prototype.f2 = function(){}

这真的很烦人。有人能帮忙吗?我试着在Foo的构造函数中执行_.bindAll(this,'1','2'(,但没有成功。

您在一条注释中提到,您正在使用将f1设置为事件处理程序

canvas.addListner('mousedown',this.f1, false)

相反,你可以通过一个闭包:

var self = this;
canvas.addListner('mousedown',function() {
    self.f1();
}, false);

或者使用Undercore.js库的bind方法:

canvas.addListner('mousedown', _.bind(this.f1, this), false);

如果使用var foo = new Foo();,您的代码将正常工作。然后,只需使用foo.f1();。foo将是f1中的this

原因是,当您对构造函数使用new时,_proto链接将附加到将成为新实例的对象。这个_proto_链接指向构造函数的原型。在运行时,如果实例的已访问属性/方法不直接存在于实例上,则解释器将遵循_proto_,并尝试访问那里的属性/方法。

如果要调用具有显式对象this的函数,可以执行myFunc.call(myObjThatWillBeThis)

您的代码应该更改为:

function Foo() {
  this.f1 = function() {
    this.f2();
  }
  this.f2 = function() {
  }
}

试试这个:

    var Foo = function() {};
    Foo.prototype.f1 = function() {this.f2();};
    Foo.prototype.f2 = function() {};
    var foo = new Foo();
    var proxyFn = function(fooInstance) {
        fooInstance.f1();
    };
    canvas.addListener('mousedown', proxyFn(foo), false);

或者更通用的东西:

    var bindFunction = function(fnToBind, scopeObj) {
        return function() {  // closure scope will contain bindFunction args
            fnToBind.call(scopeObj);
        };
    };
    var Foo = function() {};
    Foo.prototype.f1 = function() {this.f2();};
    Foo.prototype.f2 = function() {};
    var foo = new Foo();
    var proxyFn = bindFunction(Foo.prototype.f1, foo);
    canvas.addListener('mousedown', proxyFn, false);

这是有效的:

function Foo() {
    this.f1 = this.f1.bind(this);
    this.f2 = this.f2.bind(this);
}
Foo.prototype.f1 = function () { this.f2(); };
Foo.prototype.f2 = function () { console.log("f2"); };
var foo = new Foo();
var f = foo.f1;
f();

http://jsfiddle.net/VYdNx/3/

正如这样:

function Foo() {
    _.bindAll(this);
}
Foo.prototype.f1 = function () { this.f2(); };
Foo.prototype.f2 = function () { console.log("f2"); };
var foo = new Foo();
var f = foo.f1;
f();

http://jsfiddle.net/VYdNx/2/