Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jfusco/es6-event-emitter
Custom, simple, extendable event/messaging system written in ES6
https://github.com/jfusco/es6-event-emitter
emitter es2015 es6 events isparta istanbul jasmine karma karma-jasmine listener pub-sub pubsub
Last synced: 3 days ago
JSON representation
Custom, simple, extendable event/messaging system written in ES6
- Host: GitHub
- URL: https://github.com/jfusco/es6-event-emitter
- Owner: JFusco
- License: mit
- Created: 2016-04-02T19:12:25.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-01-12T09:42:44.000Z (over 1 year ago)
- Last Synced: 2024-04-14T09:40:17.809Z (6 months ago)
- Topics: emitter, es2015, es6, events, isparta, istanbul, jasmine, karma, karma-jasmine, listener, pub-sub, pubsub
- Language: HTML
- Homepage:
- Size: 615 KB
- Stars: 16
- Watchers: 0
- Forks: 2
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# es6-event-emitter
[![Build Status][build-image]][build-url]
[![devDependency Status][dev-dep-image]][dev-dep-url]
[![MIT][mit-image]][mit-url]
[![npm][npm-version-image]][npm-url]
> Custom, simple, extendable event/messaging system written in ES6
## Getting Started ##
#### Installation
From the root of your project.
```sh
npm install es6-event-emitter --save
```
#### Usage
Simple implementation of emitter. See [api](#api) below.
```
import Emitter from 'es6-event-emitter';
export default class Component extends Emitter {
constructor(){
super();
}
//-- Trigger
someAction(){
...
this.trigger('component:action');
}
//-- Trigger with data
someOtherAction(){
...
this.trigger('component:otheraction', {
foo: 'bar',
baz: 'buzz'
});
}
}
//-- Create a new component
const component = new Component();
//-- Set up functions for listeners - best practice in case you want to remove them later.
const action = () => {
console.log('action triggered');
}
const otheraction = data => {
console.log(`other action triggered with data ${data}`);
}
//-- Register listeners
component.on('component:action', action);
component.on('component:otheraction', otheraction);
//-- Call methods
component.someAction();
component.someOtherAction();
```
#### API
* **[`on`](#on)**
* **[`off`](#off)**
* **[`once`](#once)**
* **[`trigger`](#trigger)**
* **[`destroy`](#destroy)**
##### on - **`on(event:String, callback:Function)`**
Registers a listener
```js
component.on('component:action', action);
```
##### off - **`off(event:String, callback:Function)`**
Removes a registered listener from the event stack
```js
component.off('component:action', action);
```
##### once - **`once(event:String, callback:Function)`**
Registers a listener that will only fire once no matter how many times you try to trigger
```js
component.once('component:action', action);
```
##### trigger - **`trigger(event:String, ...args:*)`**
Triggers a registered event with optional data
```js
this.trigger('component:action');
//-- With data
this.trigger('component:action', {
foo: 'bar',
baz: 'buzz'
});
```
##### destroy - **`destroy()`**
Destroys the entire event emitter
```js
component.destroy();
```
## Tests ##
View the [test coverage](https://jfusco.github.io/es6-event-emitter/coverage/reports/lcov-report/src/index.html)
```
npm test
```
[build-image]: https://travis-ci.org/JFusco/es6-event-emitter.svg?branch=master
[build-url]: https://travis-ci.org/JFusco/es6-event-emitter
[mit-image]: https://img.shields.io/npm/l/es6-event-emitter.svg?style=flat-square
[mit-url]: https://github.com/JFusco/es6-event-emitter/blob/master/LICENSE
[npm-version-image]: https://img.shields.io/npm/v/npm.svg?maxAge=2592000
[npm-url]: https://www.npmjs.com/package/es6-event-emitter
[dev-dep-image]: https://david-dm.org/JFusco/es6-event-emitter/dev-status.svg
[dev-dep-url]: https://david-dm.org/JFusco/es6-event-emitter?type=dev