What & Why
A sub 1Kb event emitter class with broader functionality.
Why another one ?
I needed some specific but not unheard of features of event emitter and all the lightweight implementations I founds were all missing one or the other, so I ended up making my own with set of features that I needed. It's not better or worse than other ones, it just combines a specific set.
So here's what I needed from event emitter and ended up implementing in this one:
- Small footprint, 1Kb or less.
- Chainalbe methods.
- Instantiate with
new
as well as extend existing object. - Reliable listener removal (usually
once
were implemented as wrappers so you couldn't remove them by same listener reference). - Ability to remove all listeners for given event. See
.off(event)
- Ability to remove all listeners for all events. See
.off(event)
- Priority listeners (added to the start of the queue instead of end). See
.on()
- Ability to pass context to the listener as this keyword. See
.on()
- Ability to stop propagation of current event, smth like
preventDefaults
. See.emit()
- Ability to pass arguments together with event. See
.emit()
- Ability to check whether specific listener is subscribed for a specific event. See
.triggers()
- Ability to check whether emitter has any listeners subscribed for specified event or any listeners at all. See
.triggers()
- Available under diferent formats (ES3, ES5, ES6, Browser, inlined)
Stats
Coverage
Type | Coverage |
---|---|
Statements | 100% (130/130) |
Branches | 100% (84/84) |
Functions | 100% (18/18) |
Lines | 100% (126/126) |
dist
directory size listing
Name | Bytes | Gzip | % |
---|---|---|---|
Emitter.es3.browser.js | 3289 | 813 | 24% |
Emitter.es3.browser.min.js | 1022 | 501 | 49% |
Emitter.es3.inlined.js | 3286 | 810 | 24% |
Emitter.es3.inlined.min.js | 1019 | 499 | 48% |
Emitter.es3.umd.js | 4120 | 976 | 23% |
Emitter.es3.umd.min.js | 1276 | 607 | 47% |
Emitter.es6.inlined.js | 3069 | 789 | 25% |
Emitter.es6.inlined.min.js | 883 | 481 | 54% |
Emitter.es6.js | 3076 | 794 | 25% |
Emitter.es6.min.js | 899 | 493 | 54% |
Emitter.js | 3161 | 843 | 26% |
Emitter.min.js | 975 | 535 | 54% |
Usage
Package manager
npm i kilo-emitter
yarn add kilo-emitter
Browser tag
Inlined
Or you can just grab this compiled inlined version and copy-paste it in your code.
ES3, 1019 Bytes
var {{this$evt={}}return t{var n;return e&&"object"==typeof e&&n="$evt""on""off""once""emit""triggers"e}tprototype{var ir=this$evt;return t&&e&&"boolean"==typeof n?o=nn=null:e$ctx=ni=rt?thiso?i:i:i=ert=ithis}tprototype{return t&&e&&e$once=!0thisthis}tprototype{var noi=argumentslengthr=this$evt;return 0===i?this$evt={}:1===i?delete rt:-1<n=o=rt?o:-1&&oolength||delete rtthis}tprototype{var noir=this$evtt;ifr&&i=rlengthforr=rn=0;n<i;n++"stopEmit"===o=rn&&n=io$once&&thisdelete o$once;return this}tprototype{var no=argumentslengthi=this$evt;return o?!!n=it&&!1<o||-1<n:!!Objectlength}t};
ES6, 883 Bytes
Node
const Emitter = let { console } let myEmitter = myEmittermyEmitter // `Hello World!`console // truemyEmitterconsole // false
ES6/TypeScript
myEmitter.once'evt', console.logmyEmitter.once'evt2', console.logmyEmitter.emit'evt', // 'hey there'console.logmyEmitter.triggers'evt', console.log // falseconsole.logmyEmitter.triggers // truemyEmitter.offconsole.logmyEmitter.triggers // false
Browser
API
static
extend(target)
Extends target object that is passed to it with Emitter class methods. It creates new Emitter class and assigns all of it's fields and methods (including $evt) to target object. Note that those methods will override existing fields with same names and also should now be invoked on target since they rely on this
keyword.
- target object An object that will be extended.
let someObject = someField: 'someValue'Emitter someObjectsomeObject
on(event, listener, context, priority)
Subscribes a listener to an event. Listener will persist until removed with .off(). Subscribing an existing listener again will move it to the end (or start, if priority specified) of the queue. Unique listener is considered a combo of an event name and a reference to a function. If a same callback added with a different context it will be considered as a same listener. Context parameter is skipable, if you pass boolean as 3rd argument it will be used as priority.
- event string Event name you want to subscribe to.
- listener Listener Listener callback to be invoked.
- context object|boolean
optional
Context to invoke callback with (pass as this) OR a boolean value for priority if you want to skip context - priority Boolean
optional
If true will add listener to the start of the queue.
let em = em // regular listenerem // listener with contextem // listener with priority (added to the start of queue)em // same em
once(event, listener, context, priority)
Same as .on()
but listener will be automatically removed after first invocation.
- event string Event name you want to subscribe to.
- listener Listener Listener callback to be invoked.
- context object|boolean
optional
Context to invoke callback with (pass as this) OR a boolean value for priority if you want to skip context - priority Boolean
optional
If true will add listener to the start of the queue.
let em = let {} emconsole // true emconsole // false
off(event, listener)
If both arguments are passed it removes the listener if such exists. If only event name is passed it will remove all the listeners for that event. If no arguments passed it will purge all the listeners for current emitter. Distinction is made by the length of the arguments
variable to avoid undesired behaviour when null
or undefined
are passed due to an error. This means that off('init')
will try to remove all listeners for 'init' event and off(null)
will try to remove all events for 'null' event.
- event string
optional
Event name you want to unsubscribe from. - listener Listener
optional
Listener callback you want to remove.
let em = let {}em // removed on 1sk offem // removed on 2sk offem // removed on 3sk off// removes specific listenerem// removes all listeners for eventem// removes all listeners completelyem
emit(event, args)
If both arguments are passed it removes the listener if such exists. If only event name is passed it will remove all the listeners for that event. If no arguments passed it will purge all the listeners for current emitter. Distinction is made by the length of the arguments
variable to avoid undesired behaviour when null
or undefined
are passed due to an error. This means that off('init')
will try to remove all listeners for 'init' event and off(null)
will try to remove all events for 'null' event.
- event string Event name whose listeners should be invoked.
- args any[]
optional
Array of arguments that should be passed to each listener callback.
let em = // this listeners stops propagation and removes itselfem // this listener is triggered on second emitem emem
triggers(event, listener)
If both arguments are passed then it will check whether specific listener is subscribed for specific event. If only event name is passed it will check if there are any listeners subscribed for that event. If no arguments passed it will check if emitter has any listeners at all. Distinction is made by the length of the arguments
variable to avoid undesired behaviour when null
or undefined
are passed due to an error. This means that triggers('init')
will check if there are any listeners fot the event 'init' and triggers(null)
will check if there are any listeners fot the event 'null'.
- event string
optional
Event name for which to look. - listener Function
optional
Reference to a function instance that was used when subscribing.
let em = let {} ememem console // trueemconsole // false console // trueemconsole // false console // trueemconsole // false