javascript绑定对象的原型函数

发布于 2024-12-10 10:19:54 字数 282 浏览 6 评论 0原文

如何将对象原型中的 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,'f1','f2') 但没有运气。

How would I bind the this pointer in the objects prototype to the object's instance?

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.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

青衫负雪 2024-12-17 10:19:54

您在评论中提到您将 f1 设置为事件处理程序:

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

相反,您可以传递闭包:

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

或使用 Underscore.js 库的 bind 方法:

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

You mention in a comment that you are setting f1 as event handler with:

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:

canvas.addListner('mousedown', _.bind(this.f1, this), false);
油饼 2024-12-17 10:19:54

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

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

如果您想调用带有显式对象作为 this 的函数,可以执行 myFunc.call(myObjThatWillBeThis)

Your code would work correctly if you used var foo = new Foo();. Then, just use foo.f1();. foo will be this in f1.

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. This _proto_ link points to the prototype of the constructor function. 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.

If you want to call a function with an explicit object as this, you can do myFunc.call(myObjThatWillBeThis).

红焚 2024-12-17 10:19:54

您的代码应更改为:

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

Your code should be changed to:

function Foo() {
  this.f1 = function() {
    this.f2();
  }
  this.f2 = function() {
  }
}
青瓷清茶倾城歌 2024-12-17 10:19:54

试试这个:

    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);

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);
帅气称霸 2024-12-17 10:19:54

这有效:

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/

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/

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();

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

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文