Menu

gitpiper

createEventHub javascript Code Snippet in 2023

browsereventadvanced

Last Updated: 28 January 2023

Creates a pub/sub (publish–subscribe) event hub with emit, on, and off methods.

  • Use Object.create(null) to create an empty hub object that does not inherit properties from Object.prototype.
  • For emit, resolve the array of handlers based on the event argument and then run each one with Array.prototype.forEach() by passing in the data as an argument.
  • For on, create an array for the event if it does not yet exist, then use Array.prototype.push() to add the handler
  • to the array.
  • For off, use Array.prototype.findIndex() to find the index of the handler in the event array and remove it using Array.prototype.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); if (this.hub[event].length === 0) delete this.hub[event]; } });
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);

javascript snippet similar to createEventHub For You in January 2023

Subscribe to our Newsletter

Subscribe to get resources directly to your inbox. You won't receive any spam! ✌️

© 2023 GitPiper. All rights reserved

Rackpiper Technology Inc

Company

About UsBlogContact

Subscribe to our Newsletter

Subscribe to get resources directly to your inbox. You won't receive any spam! ✌️