dual-emitter

EventEmitter done right and no dependencies. For nodejs and the browser (>= IE8). Can emit custom or DOM events.

Install

npm i dual-emitter --save
npm test

Features

• minimal, yet simple to use
• just 4kb minified - no jQuery, no dependencies
• works on the browser (even IE8), use dist/dual-emitter.min.js
• works on the server, just install it and require it
• can emit (trigger or whatever you call it) DOM events manually
• have .on, .off, .once and .emit methods

Usage

For more use-cases see the tests

var DualEmitter = require('dual-emitter')
var emitter = new DualEmitter()
 
function handler () {
  console.log('foo bar')
}
 
emitter
  .once('custom', function () {
    console.log('executed once')
  })
  .on('foo', handler)
  .emit('custom', 'abc')
  .emit('custom', 'foo', ['bar', 'baz'])
  .emit('custom')
  .off('foo', handler)
  .on('click', function () {
    console.log('link clicked')
  }, document.body.querySelector('a[href]'))

API

DualEmitter

Create a new instance of DualEmitter.

• [events] {Object} Initialize with default events.

Example

var DualEmitter = require('dual-emitter')
var emitter = new DualEmitter()

.on

Add/bind event listener to custom or DOM event. Notice that this in event handler function vary - it can be the DOM element or DualEmitter instance.

• <name> {String} event name
• <fn> {Function} event handler
• [el] {Object} optional DOM element
• returns {DualEmitter} DualEmitter for chaining

Example

function handler (a, b) {
  console.log('hi', a, b) //=> hi 123 bar
}
 
function onclick (evt) {
  console.log(evt, 'clicked')
}
 
var element = document.body.querySelector('a.link')
 
emitter.on('custom', handler).emit('custom', 123, 'bar')
emitter.on('click', onclick, element).off('click', onclick, element)

.off

Remove/unbind event listener of custom or DOM event.

• <name> {String} event name
• <fn> {Function} event handler
• [el] {Object} optional DOM element
• returns {DualEmitter} DualEmitter for chaining

Example

var element = document.body.querySelector('a.link')
emitter.off('custom', handler)
emitter.off('click', onclick, element)

.once

Add one-time event listener to custom or DOM event. Notice that this in event handler function vary - it can be the DOM element or DualEmitter instance.

• <name> {String} event name
• <fn> {Function} event handler
• [el] {Object} optional DOM element
• returns {DualEmitter} DualEmitter for chaining

Example

emitter
  .once('custom', function () {
    console.log('executed one time')
  })
  .emit('custom')
  .emit('custom')
 
var element = document.body.querySelector('a.link')
emitter.once('click', function () {
  console.log('listen for click event only once')
}, element)

.emit

Emit/execute some type of event listener. You also can emit DOM events if last argument is the DOM element that have attached event listener.

• <name> {String} event name
• [args...] {Mixed} context to pass to event listeners
• [el] {Object} optional DOM element
• returns {DualEmitter} DualEmitter for chaining

Example

var i = 0
 
emitter
  .on('custom', function () {
    console.log('i ==', i++, arguments)
  })
  .emit('custom')
  .emit('custom', 123)
  .emit('custom', 'foo', 'bar', 'baz')
  .emit('custom', [1, 2, 3], 4, 5)
 
// or even emit DOM events, but you should
// give the element as last argument to `.emit` method
var element = document.body.querySelector('a.link')
var clicks = 0
 
emitter
  .on('click', function (a) {
    console.log(a, 'clicked', clicks++)
  }, element)
  .emit('click', 123, element)
  .emit('click', element)
  .emit('click', foo, element)

._isDom

Check that given val is DOM element. Used internally.

• val {Mixed}
• returns {Boolean}

Example

var element = document.body.querySelector('a.link')
 
emitter._isDom(element) //=> true
emitter._isDom({a: 'b'}) //=> false

._hasOwn

Check that key exists in the given obj.

• obj {Object}
• key {String}
• returns {Boolean}

Example

var obj = {a: 'b'}
 
emitter._hasOwn(obj, 'a') //=> true
emitter._hasOwn(obj, 'foo') //=> false

.extend

Static method for inheriting both the prototype and static methods of the DualEmitter class.

• Ctor {Function} The constructor to extend.

Example

function MyApp(options) {
  DualEmitter.call(this)
}
DualEmitter.extend(MyApp)
 
// Optionally pass another object to extend onto `MyApp`
function MyApp(options) {
  DualEmitter.call(this)
  Foo.call(this, options)
}
DualEmitter.extend(MyApp, Foo.prototype)

Contributing

Pull requests and stars are always welcome. For bugs and feature requests, please create an issue.
But before doing anything, please read the CONTRIBUTING.md guidelines.

Charlike Make Reagent