javascript - 在 JS 中返回对象属性时出错

Question

function Objecte(name){

    this.name=name;

}

Objecte.prototype.look=function(){

    return function(){

        alert(this.name);

    };

}

我正在尝试访问对象的属性，但是当我调用该函数时，它会发出未定义的警报。

extintor = new Objecte("extintor");

$(document).on('dblclick',"#extintor",extintor.look());

score 1 · Accepted Answer

this没有词法定义。您需要捕获它的值以确保返回的函数可以使用它。

Objecte.prototype.look=function(){
    var self = this;
    return function() {
        alert(self.name);
    };
}

你也可以使用$.proxy

Objecte.prototype.look=function(){
    return $.proxy(function() {
        alert(this.name);
    }, this);
}

或.bind()在现代浏览器中

Objecte.prototype.look=function(){
    return function() {
        alert(this.name);
    }.bind(this);
}

score 0 · Accepted Answer

看起来需要返回一个函数吗？我认为您正在尝试做的是：

Objecte.prototype.look=function(){

    alert(this.name);

}

但是，this在此上下文中，将在函数执行时解析并可能绑定到另一个对象。我认为在任何情况下使用对象的闭包声明而不是使用原型更清楚。你可以这样声明你的对象：

function Objecte(name) {
    var that = this;

    this.name = name;

    this.look = function() {
        alert(that.name);
    }
}

缺点是每个 Objecte 类型的对象都会有自己的函数外观副本，但是你最后一次用完内存是什么时候？另一个缺点是你不能从另一个对象继承，重写一个方法，然后从这个对象调用原始方法，因为它会丢失。然而不利的是..

score 0 · Accepted Answer

您返回的匿名函数具有另一个上下文this。

因此，您有两种选择：

1. 创建对this外部的引用并在匿名函数中使用它

Objecte.prototype.look = function() {
    var objecteInstance = this;
    return function() {
        alert(objecteInstance.name);
    };
}

2.Function.prototype.bind包括IE9+在内的所有主流浏览器都支持使用

Objecte.prototype.look = function() {
    return function() {
        alert(this.name);
    }.bind(this);
}

如果您不需要支持 IE8 及更低版本，那么第二个选项就是 - 对我来说它看起来更优雅。

3 回答 3