返回介绍

createEventHub - 创建事件中转advanced

发布于 2019-05-30 01:44:35 字数 1802 浏览 1085 评论 0 收藏 0

使用 emitonoff 方法创建一个 pub/sub (publish–subscribe) 事件中转。

使用 Object.create(null) 来创建一个空的 hub 对象,它不会从 Object.prototype 继承属性。 对于 emit ,根据 event 参数解析处理程序数组,然后通过传递数据作为参数来运行每个 Array.forEach() 。 对于 on,如果事件不存在,则为事件创建一个数组,然后使用 Array.push() 来添加处理程序 到阵列。 对 off,使用 Array.findIndex() 来查找事件数组中的处理程序的索引,并使用 Array.splice() 将其删除。

const createEventHub = () => ({
  hub: Object.create(null),
  emit(event, data) {
    (this.hub[event] || []).forEach(handler => handler(data));
  },
  on(event, handler) {
    if (!this.hub[event]) this.hub[event] = [];
    this.hub[event].push(handler);
  },
  off(event, handler) {
    const i = (this.hub[event] || []).findIndex(h => h === handler);
    if (i > -1) this.hub[event].splice(i, 1);
  }
});
const handler = data => console.log(data);
const hub = createEventHub();
let increment = 0;

// Subscribe: listen for different types of events
hub.on('message', handler);
hub.on('message', () => console.log('Message event fired'));
hub.on('increment', () => increment++);

// Publish: emit events to invoke all handlers subscribed to them, passing the data to them as an argument
hub.emit('message', 'hello world'); // logs 'hello world' and 'Message event fired'
hub.emit('message', { hello: 'world' }); // logs the object and 'Message event fired'
hub.emit('increment'); // `increment` variable is now 1

// Unsubscribe: stop a specific handler from listening to the 'message' event
hub.off('message', handler);

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文