diff --git a/snippets/createEventHub.md b/snippets/createEventHub.md new file mode 100644 index 000000000..de2b0139e --- /dev/null +++ b/snippets/createEventHub.md @@ -0,0 +1,45 @@ +### createEventHub + +Creates a pub/sub ([publish–subscribe](https://en.wikipedia.org/wiki/Publish%E2%80%93subscribe_pattern)) 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.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.push()` to add the handler +to the array. +For `off`, use `Array.findIndex()` to find the index of the handler in the event array and remove it using `Array.splice()`. + +```js +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); + } +}); +``` + +```js +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); +``` diff --git a/tag_database b/tag_database index 8fad426f9..7330da5ca 100644 --- a/tag_database +++ b/tag_database @@ -22,6 +22,7 @@ countVowels:string createElement:browser,utility currentURL:browser,url curry:function,recursion +createEventHub:browser,event,advanced deepFlatten:array,recursion defer:function detectDeviceType:browser