Question

我正在尝试扩展Node.addEventListener方法，以便我可以执行一些事件管理，如：

Node.prototype.on = function (type, listener, useCapture) {
    'use strict';
    var i, evt;

    this.events = this.events || [];


    for (i = 0; i < this.events.length; i += 1) {

        evt = this.events[i];

        if (this === evt[0] && type === evt[1]) {
            this.removeEventListener(type, evt[2], evt[3]);
            this.events.splice(i, 1);
        }

    }

    this.events.push([this, type, listener, useCapture]);

    return this.addEventListener(type, listener, useCapture);  
};

但在这种情况下，我不想将其命名为on，而是将其命名为addEventListener，因此我可以保证任何javascript都能正常使用。

所以这里的重点是，如果我将函数命名为addEventListener而不是在return子句上，它将导致无限循环。所以我在想是否有办法让它调用super方法呢？

提前致谢

Answer 1

首先让我再次指出（对于其他读者），extending the DOM is a bad idea in general。

那就是说，如果环境允许你，可以做的就是：

您可以保留对原始addEventListener功能的引用，并使用.call进行调用这仅在addEventListener公开此方法时有效（即类似于本机JavaScript函数）并且您实际上可以覆盖addEventListener：

// immediate function to create scope
(function() {
    // keep a reference to the original method
    var orig_addEventListener = Element.prototype.addEventListener;

    Element.prototype.addEventListener = function (type, listener, useCapture) {
        // your code here
        //...
        // call the original method
        return orig_addEventListener.call(this, type, listener, useCapture);  
    };

}());

请注意addEventListener是Element接口的方法，而不是Node接口的方法。

再说一次：这不能保证有效，即使它现在有效，也可能在未来发生。

使用相同的名称扩展Node.addEventListener方法

1 个答案: