symbol-observable

What is symbol-observable?

The symbol-observable package is primarily used to polyfill the Observable symbol, which is a proposed addition to the ECMAScript standard. It allows JavaScript objects to be observable, meaning that other objects can subscribe to them and react to changes. This is particularly useful in reactive programming models and libraries, such as RxJS, where data streams and their transformations are a core concept.

What are symbol-observable's main functionalities?

Polyfill for Observable Symbol

This code demonstrates how to use the symbol-observable package to make an object observable. It defines a simple observable that emits 'hi' every second. An observer subscribes to this observable to log the emitted values. This showcases how symbol-observable can be used to implement the observer pattern in JavaScript.

"use strict";

const symbolObservable = require('symbol-observable').default;

console.log(typeof symbolObservable); // 'symbol' in environments with native Symbol support

const obj = {};
obj[symbolObservable] = function () {
  return {
    subscribe(observer) {
      const intervalID = setInterval(() => observer.next('hi'), 1000);

      return {
        unsubscribe() {
          clearInterval(intervalID);
        }
      };
    }
  };
};

const observable = obj[symbolObservable]();
const subscription = observable.subscribe({
  next(val) { console.log(val); },
  complete() { console.log('Done'); }
});

// Later:
// subscription.unsubscribe();

Other packages similar to symbol-observable

rxjs

RxJS is a library for reactive programming using Observables, to make it easier to compose asynchronous or callback-based code. Unlike symbol-observable, which provides the basic polyfill for the Observable symbol, RxJS offers a comprehensive suite of operators for transforming, combining, and managing asynchronous streams of data.

zen-observable

Zen Observable is a lightweight implementation of Observables for JavaScript. It provides an Observable class that can be used directly, without needing a polyfill. Compared to symbol-observable, Zen Observable offers more out-of-the-box functionality, including a full implementation of the Observable spec, rather than just providing the symbol.

README

symbol-observable

Symbol.observable ponyfill

Install

$ npm install --save symbol-observable

Basic Usage

const symbolObservable = require('symbol-observable').default;

console.log(symbolObservable);
//=> Symbol(observable)

import Symbol_observable from 'symbol-observable';

console.log(Symbol_observable);
//=> Symbol(observable)

Making an object "observable":

You can do something like what you see below to make any object "observable" by libraries like RxJS, XStream and Most.js.

Things to know:

1. It's best if you just use one of the above libraries.
2. If you're not, but sure you never next, error or complete on your observer after error or complete was called.
3. Likewise, make sure you don't next, error or complete after unsubscribe is called on the returned object.

import Symbol_observable from 'symbol-observable';

someObject[Symbol_observable] = () => {
  return {
    subscribe(observer) {
      const handler = e => observer.next(e);
      someObject.addEventListener('data', handler);
      return {
        unsubscribe() {
          someObject.removeEventListener('data', handler);
        }
      }
    },
    [Symbol_observable]() { return this }
  }
}

Often, it's not very hard, but it can get tricky in some cases.

Related

• is-observable - Check if a value is an Observable
• observable-to-promise - Convert an Observable to a Promise

License

MIT © Sindre Sorhus and Ben Lesh

Changelog

2.0.1 (2020-09-04)

Bug Fixes

• package.json: es/ponyfill.js no longer typoed (ad2c079)
• Resolve issues in environments with frozen Symbol (2323882)