npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

mitty

v2.0.2

Published

Simple event emitter for javascript. Enables objects to publish and subscribe to events

Downloads

139

Readme

Mitty

Build Status Coverage Status NPM Status

Simple event emitter for javascript. Enables objects to publish and subscribe to custom events. Works client and server side. Weighs less than 1KB.

Demo and documentation can be found here

With mitty every extended object can publish and listen to custom events. Objects can be both publishers and subscribers simultaneously. Mitty provides a simple api for one object to listen to it's own events or subscribe to some other object events.

Supports all browsers that are ES5-compliant (IE8 and below are not supported).

Examples and api

on and trigger

Subscribe object to events with on(), publish events with trigger().

// start with simple object
var musician = {name: 'George'};

// use "mitty" function to augment object with event api
mitty(musician);

// subscribe to play event
musician.on('play', function(message) {
    console.log(this.name + ' is currently playing. ' + message);
});

// trigger / publish "play" event with custom message as data
// outputs 'George is currently playing. With style!'
musician.trigger('play', 'With style!');

off

Remove events with off()

// Remove subscription
musician.off('play');

// Trigger does nothing since we removed  subscription
musician.trigger('play', 'With style again!');

listenTo and stopListening

Use listenTo() when you want to subscribe to some other object events. Invoke stopListening() when you want to remove those subscriptions.

var instrument = mitty({type: 'Guitar'});

instrument.listenTo(musician, 'play', function() {
    console.log(musician.name + ' is playing ' + this.type + ' with grace!');
});

// Outputs 'George is playing Guitar with grace!'
musician.trigger('play');

// Remove subscription
instrument.stopListening(musician);

// Will not output
musician.trigger('play');

once and listenToOnce

Use once() and listenToOnce() when for executing one time event listeners.

var musician = mitty({name: 'George', playedTimes: 0});

musician.once('play', function() {
    musician.playedTimes += 1;
});

musician.trigger('play').trigger('play').trigger('play');

console.log(musician.playedTimes) // outputs 1
var musician = mitty({name: 'George'});
var instrument = mitty({type: 'Guitar', playedTimes: 0});

instrument.listenToOnce(musician, 'play', function() {
    instrument.playedTimes += 1;
});

musician.trigger('play').trigger('play').trigger('play');

console.log(instrument.playedTimes) // outputs 1

Augmenting objects

Types / prototype based constructor functions can also be augmented with events like so:

function Person(name) {
    this.name = name;
}

mitty(Person.prototype);

var john = new Person('John');

john.on('sayHello', function() {
    console.log(this.name + ' says hello');
});

john.trigger('sayHello'); // outputs 'John says hello'

Installation

Mitty types is packaged as UMD library so you can use it both on client and server (CommonJS and AMD environment) or with browser globals.

// install via npm
npm install mitty --save

// if you use bundler
var mitty = require('mitty');

// or use browser globals
var mitty = window.mitty;