Observable Study - RxJS - https://out.stegrider.now.sh/

observable-flow.js

const { fromEvent } = Rx;
const { map, pluck } = RxOperators;

const input = document.createElement('input');
const container = document.querySelector('.container');
container.appendChild(input)

const observable = fromEvent(input, 'input')
	.pipe(
  	//map(event => event.target.value),
    pluck('target', 'value'),
    map(value => parseInt(value)),
    map(value => {
    	if(isNaN(value)) {
  			throw new Error('Inform a number!');
  		}
			return value;
    })
  );

// observer
observable.subscribe({
	next(value) {
  	console.log(`Your value is ${value}`);
  },
  error(err) {
  	console.error(`BAD THING HAPPEN!!!`, err.message);
  },
})

observable;

observable-low-level.js

const { Observable } = Rx;

const observable = new Observable((subscriber) => {
	// Throw the value 1 into our pipeline
  subscriber.next(1)
  
  // complete e finish all flow, no more values will come out
  subscriber.complete();
  
  // emit an error, no more values will come out
  subscriber.error(new Error('Error Notification!'));
});

observable.subscribe({
	next(value) {
  	console.log(value);
  },
  complete() {
  	console.log('complete');
  },
  error(err) {
  	console.log('ERROR', err.message);
  }
});