0

我正在尝试为我正在制作的一个小画布库制作一个事件类！

这是我目前所拥有的

function Events() {

};

Events.prototype.addEvents = function() {

    this.mousemove = false;
    this.onMousemove = function() {

        if (this.mousemove) {
            this.mousemove();
        }
    };
    this.mousedown = false;
    this.onMousedown = function() {

        if (this.mousedown) {
            this.mousedown();
        }
    };
    this.mouseup = false;
    this.onMouseup = function() {

        if(this.mouseup) {
            this.mouseup();
        }
    };
    this.click = false;
    this.onClick = function() {

        if (this.click) {
            this.click();
        }
    };
    this.on = function(type, callback) {

    };

};

我现在不能做的是将它添加到我要为其分配事件的其他对象中。例如，另一个对象将是一个具有绘制方法的简单矩形。

function Rect() {

    this.draw = function(context) {
         // code
    };
};

// How can I add Events prototype properties to Rect? I have tried...
// Rect.prototype = new Object.create(Events.prototype);
// Rect.prototype = Object.create(new Events.prototype);

我基本上希望事件原型将它的所有属性提供给另一个我想要事件的对象？

谢谢你，我希望我说得通！！

4

2 回答 2

1

因此，如果我没记错的话，您希望 的原型从 . 的原型Rect()继承方法。addEvent()Events()

new使用时不使用Object.create，所以new Object.create(Events.prototype)是错误的。你可以这样做：

Rect.prototype = Object.create(Events.prototype);

但是，Internet Explorer 8 及更低版本不支持 Object.create，因此您可能更愿意使用此函数：

function inherit(children, parent) {
    var F = function() {};
    F.prototype = parent.prototype;
    children.prototype = new F();
    children.prototype.constructor = children;
};

JavaScript 中有几种继承模式，这只是其中之一。如果你想学习其他人，你可以看看 Stoyan Stefanov 的书JavaScript Patterns，但无论如何，这本书可以完成这项工作。

如您所见，它使用临时函数 F() 作为子级和父级之间的链接。我们本可以这样做children.prototype = parent.prototype，但是如果我们在某些时候更改 children.prototype 中的某些内容，实际上我们将更改 parent.prototype - 我们可能不希望那样。

我们也不想这样做：Rect.prototype = new Events(). 这也会将 Rect.prototype 与 Event 的原型链接起来，但如果我们这样做了，在 Events 中声明的任何带有关键字的东西this都将被添加到 Rect 中——这可能是我们不希望发生的事情。例如，如果事件包括this.whatever = 'value'，那么whatever将被添加到Rect.prototype。

因此，您只需调用所描述的继承函数并将这两个函数作为参数传递，以这种方式：

inherit(Rect, Events);

那么 Rect.prototype 就是要继承 Event 原型的方法。

于 2013-05-02T13:45:52.447 回答
0

如果您使用的是 jquery，这可能会对您有所帮助。 

$.fn.addEvents = function() {

    this.mousemove = false;
    this.onMousemove = function() {

        if (this.mousemove) {
            this.mousemove();
        }
    };
    this.mousedown = false;
    this.onMousedown = function() {

        if (this.mousedown) {
            this.mousedown();
        }
    };
    this.mouseup = false;
    this.onMouseup = function() {

        if(this.mouseup) {
            this.mouseup();
        }
    };
    this.click = false;
    this.onClick = function() {

        if (this.click) {
            this.click();
        }
    };
    this.on = function(type, callback) {

    };

};

现在，调用上述函数如下：

$(selector).addEvents();

我希望这能帮到您。谢谢你。

于 2013-05-02T11:34:45.853 回答