Observable is a JavaScript mixin for adding observer methods to a function. It's similiar to the jQuery event system, but can be added into any other module. You can use it for your own JavaScript libraries.

npm install observable_js or copy the source from lib/observable.js. Observable will be assigned to the global scope if you don't use node and no other AMD or CommonJS loader is present.

ES6:

class MyLibrary extends Observable {  }

CoffeeScript:

class MyLibrary extends Observable

(Don't forget to call super if your extended ES6/CoffeeScript class has its own constructor function.)

Other usages:

// Adding the Observable methods to an existing object:
Observable.mixin(a)
// Add the methods to the prototype of a constructor function
Observable.mixin(Constructor.prototype)
// Create a new object that has all the Observable methods
var a = new Observable()

• Super easy to use for your library, just extend from it or mixin the methods
• Most methods are overloaded, making the API very nice to use
• All methods are chainable
• It's very well tested
• Node / NPM and the browser are both supported

The object that gains the observable methods will be called x in this README for convenience.

You can watch a single event:

x.on('topic', fn);

You can also watch several events at once:

x.on(['topic1', 'topic2'], fn);

Or watch several events at once that need different handlers:

x.on({
  topic1: fn,
  topic2: fn2
});

The once method behaves exactly like on and accepts the same arguments, but after triggering the event for the first time the event will be removed.

x.once('topic', fn);
x.trigger('topic'); // fn will be triggered
x.trigger('topic'); // fn won't be triggered, event doesn't exist anymore

Calling .trigger('topic') will execute all function subscribed to 'topic'.

x.on('topic', function () {
	console.log('topic called');
});
x.trigger('topic'); // Logs 'topic called'

You can also pass arguments to the subscribed functions by passing an array as the second argument:

x.on('topic', function (arg1, arg2) {
	console.log(arg1, arg2);
});
x.trigger('topic', [[1, 2], true]); // Logs [1, 2] and true

This method accepts the exact same arguments as on and once. You pass the topic and the functions you want to unsubscribe. Observable will only remove the passed function from the topic.

x.on('topic', fn),
x.off('topic', fn);
x.on(['topic2', 'topic3'], fn2);
x.off(['topic2', 'topic3'], fn2);
x.on({ topic: fn })
x.off({ topic: fn })

You can call off without any arguments to remove all events. You should only do this if you know what you're doing!

x.off();

All methods return the parent object so you can use chaining.

x.on('topic', fn).off('topic2').trigger('topic3');

• x18n

• Python: pyobservable