如何使用javascript实现完整的事件系统?

我正在创建一个客户端动态博客引擎。 现在,我需要一个事件系统来处理DOM元素和引擎中的许多操作。 例如引擎正在加载文章,用户正在切换主题...

而且我不想使用库来执行此操作。

到目前为止,我已经完成了使用列表存储事件回调的操作。

但是我希望每个回调都可以与不同的对象一起使用,就像DOM事件一样。

我可能会向每个对象添加一个类似于id的属性,并在事件中存储(id,回调)。我感觉不太好。当带有动态生成的对象时,处理起来可能很复杂。

如何实现与DOM事件一样简单(使用)?

评论
wiusto
wiusto

您可以实现中介模式:

http://addyosmani.com/resources/essentialjsdesignpatterns/book/#mediatorpatternjavascript

这本书是您需要了解的所有内容。

点赞
评论
莫i相忘
莫i相忘

Recently, I wanted to add simple event listeners to vanilla JavaScript objects. This is the solution I came up with

(This requires ecmascript >= 5)

function Emitter () {
  var eventTarget = document.createDocumentFragment();

  function delegate (method) {
    this[method] = eventTarget[method].bind(eventTarget);
  }

  Emitter.methods.forEach(delegate, this);
}

Emitter.methods = ["addEventListener", "dispatchEvent", "removeEventListener"];

现在是一个使用它的“类”

function Example () {
  Emitter.call(this);
}

让我们现在尝试一下!

var e = new Example();

e.addEventListener("something", function(event) {
  alert("something happened! check the console too!");
  console.log(event);
});

e.dispatchEvent(new Event("something"));

祝好运!

点赞
评论