Question

我正在尝试使用Prototype模式为Web控件创建客户端api。但是，我想通过不必管理“这个”来让生活更轻松。

这是一些示例代码（我已经评论了有问题的行）：

MyObject = function ()
{
    MyObject.initializeBase(this);

    this._someProperty = null;
};    

MyObject.prototype = {

    initialize: function()
    {
        // Init
    },

    get_someProperty: function()
    {
        return this._someProperty;
    },

    set_someProperty: function(value)
    {
        this._someProperty = value;
    },    

    doSomething: function ()
    {
        $('.some-class').each(function ()
        {
            $(this).click(this.doClick);  // this.doClick is wrong
        });
    },

    doClick: function ()
    {
        alert('Hello World');
    }
};

通常，使用揭示模块模式我会声明一个私有变量：

var that = this;

我可以使用Prototype模式做类似的事情吗？

Answer 1

您可以完全按照惯例执行操作，只需在doSomething方法中执行此操作：

doSomething: function ()
{
    var instance = this;
    $('.some-class').each(function ()
    {
        $(this).click(instance.doClick);
    });
},

这种方法与prototype无关，它只是如何使用嵌套函数管理上下文。因此，当原型（方法）上的函数具有嵌套函数时，如果要在嵌套范围内访问它，则可能必须在任何这些级别保留上下文this。

Answer 2

ES5的Function.prototype.bind()可能是您的选择。你可以像

一样

doSomething: function ()
{
    $('.some-class').each(function(_, node)
    {
        $(node).click(this.doClick);  // this.doClick is right
    }.bind(this));
},

现在，我们通过调用.bind() 代理每个事件处理程序，结果，我们在原型对象的上下文中调用它。需要注意的是，您不再this引用实际的 DOM节点，因此我们需要使用jQuery中传入的参数。

原型模式和“这个”

2 个答案: