[英]javascript binding object's prototype function
How would I bind the this pointer in the objects prototype to the object's instance? 如何将对象原型中的this指针绑定到对象的实例?
function Foo(){ }
Foo.prototype.f1 = function(){this.f2();} //is wrong because 'this' does not refer to Foo instance
Foo.prototype.f2 = function(){}
This is really annoying. 真烦人。 Can anyone help?
有人可以帮忙吗? I tried doing _.bindAll(this,'f1','f2') inside Foo's constructor but no luck.
我尝试在Foo的构造函数中执行_.bindAll(this,'f1','f2'),但没有运气。
Your code would work correctly if you used var foo = new Foo();
如果使用
var foo = new Foo();
您的代码将正常工作var foo = new Foo();
. 。 Then, just use
foo.f1();
然后,只需使用
foo.f1();
. 。 foo will be
this
in f1
. foo将是
f1
this
。
The reason is that when you use new
against a constructor function, a _proto
link will be attached to the object that will be the new instance. 原因是,当对构造函数使用
new
时, _proto
链接将附加到作为新实例的对象上。 This _proto_
link points to the prototype of the constructor function. _proto_
链接指向构造函数的原型。 At runtime, if an accessed property/method of the instance does not exist on the instance directly, the interpreter will follow the _proto_
, and try to access the property/method there. 在运行时,如果实例上直接不存在实例的可访问属性/方法,则解释器将遵循
_proto_
,并尝试在那里访问该属性/方法。
If you want to call a function with an explicit object as this
, you can do myFunc.call(myObjThatWillBeThis)
. 如果你想调用一个函数有明确的对象作为
this
,你可以做myFunc.call(myObjThatWillBeThis)
Your code should be changed to: 您的代码应更改为:
function Foo() {
this.f1 = function() {
this.f2();
}
this.f2 = function() {
}
}
Try this: 尝试这个:
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);
Or something more generic: 或更一般的东西:
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);
This works: 这有效:
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/ http://jsfiddle.net/VYdNx/3/
As does this: 就像这样:
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();
You mention in a comment that you are setting f1
as event handler with: 您在评论中提到,您正在使用以下命令将
f1
设置为事件处理程序:
canvas.addListner('mousedown',this.f1, false)
Instead, you can pass a closure: 相反,您可以传递闭包:
var self = this;
canvas.addListner('mousedown',function() {
self.f1();
}, false);
or use the bind
methods of the Underscore.js library: 或使用Underscore.js库的
bind
方法:
canvas.addListner('mousedown', _.bind(this.f1, this), false);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.