0

我有以下代码。什么是当使用悬停在链接上然后它控制台this。

var Mod = function () {
    $('.link').hover(this.hover, this.out);
};

Mod.prototype = function () {
    var hover = function () {
        console.log(this);
    },

    out = function () {
        console.log(this);
    };

    return {
        hover: hover,
        out: out
    }
}();

在我上面的代码this中引用了$('.link')元素，但我想将它用于当前对象。所以为了实现这一点，我可以将构造函数修改为以下。

var Mod = function () {
    var self = this;
    $('.link').hover(function () {
        self.hover();
    }, function () {
        self.out();
    });
};

这工作正常，但构造函数现在看起来很乱。第二种方法是$.proxy()再次使用 jquery，这会使我的构造函数看起来很乱。

我的问题是，当我在上面的第一个示例中使用它时，如何this将当前对象的哪些引用传递给对象内部的其余函数？jquery's hover function

4

2 回答 2

2

您问题中的代码对我来说看起来很完美。您正在调用hover并且out在正确的上下文中this有效并指向Mod这些函数内部的实例。

this在成员函数中应该始终指向对象的实例，所以即使你认为它一团糟，我也会继续这样做。一个好的 IDE 将能够在语法和自动完成方面为您或团队提供帮助，我认为这更重要。

不要这样做

虽然您可以分配this给它的数据成员，.link但会使代码的可读性降低并且容易出错：

var Mod = function () {
    $('.link').data("mod", this);
    $('.link').hover(this.hover, this.out);
};

Mod.prototype = function () {
    var hover = function () {
        console.log($(this).data("mod"));
    },

    out = function () {
        console.log($(this).data("mod"));
    };

    return {
        hover: hover,
        out: out
    }
}();

旁注：您可以简化原型定义并像这样编写它：

Mod.prototype.hover = function() {
}
Mod.prototype.out = function() {
}
于 2013-08-18T07:24:20.487 回答
1

你可以这样：

var Mod = function () {
    $('.link').hover(this.listener('hover'), this.listener('out'));
};
Mod.prototype = function () {
    var hover = function () {
        console.log(this);
        this.otherMethod();
    },
    out = function () {
        console.log(this);
        this.otherMethod();
    },
    listener = function(func) {
        var self = this;
        return function() {
            self[func]();
        }
    },
    otherMethod = function() {
        console.log("That's a method of Mod.");
    };
    return {
        hover: hover,
        out: out,
        otherMethod: otherMethod,
        listener: listener
    }
}();

只需使用返回函数的助手。你的构造函数是干净的，但你的原型不是这样:)

于 2013-08-18T07:47:22.080 回答