Что такое Observable. Примитивная реализация. https://www.youtube.com/watch?v=NK-WzH3RBds

observable-1-basic.js

'use strict';

/* Исходная задача */

for (let letter of 'Hello, world!') {
  console.log(letter);
}


/* Добавляем гибкости */

function observe(observable) {
  for (let letter of observable) {
    console.log(letter);
  }
}

observe('Hello World!');


/* Добавляем наблюдение */

function observe(observable, next, done) {
  for (let letter of observable) {
    next(letter);
  }
  done();
}

observe('Hello World!', letter => console.log(letter), () => console.log('Done!'));

observable-2-advanced.js

'use strict';

/* Исходная задача */

for (let letter of 'Hello, world!') {
  console.log(letter);
}


/* Продвинутая гибкость */

class Observable {
  constructor(source) {
    this.source = source;
    this.result = this.source;
  }
  
  subscribe(next) {
    for (let item of this.result) {
      next(letter)
    }
  }
}

new Observable('Hello world!').subscribe(letter => console.log(letter));


/* Простая реализация Observable. Больше возможностей. */

class Observable {
  constructor(source) {
    this.source = source.split(''); // превращаем в массив для filter
    this.result = this.source;
  }
  
  subscribe(next) {
    for (let item of this.result) {
      next(letter)
    }
  }
  
  filter(predicate) {
    this.result = this.result.filter(predicate);
    return this;
  }
  
  map(callback) {
    this.result = this.result.map(callback);
    return this;
  }
  
}

new Observable('Hello world!')
      .map(letter => letter.toUpperCase())
      .filter(letter => letter === 'H')
      .subscribe(letter => console.log(letter));