[RxJS] What RxJS operators are

Posted 2020-07-11 Answer1215

We have covered the basics of what is Observable.create, and other creation functions. Now lets finally dive into operators, which are the focus of this course. We will see how operators are simple pure functions attached to the Observable type.

 

var foo = Rx.Observable.of(1, 2, 3, 4, 5);

function multiplyBy(num){
  // When chaining the subscribe, the source is this keyword
  const source = this;
  // Create a observalbe and subscribe
  const result = Rx.Observable.create(function(observer ){
    // source should be immutable, everytime return a new value
    source.subscribe( (item) => {
      observer .next(item * num);
    }, (err) => {
      observer.error(err); 
    }, () => {
       observer.complete(); 
    })
  });
  
  // Return the observable
  return result;
}

// Hack
Rx.Observable.prototype.multiplyBy = multiplyBy;

var bar = foo.multiplyBy(100);

bar.subscribe(
  function (x) { console.log(‘next ‘ + x); },
  function (err) { console.log(‘error ‘ + err); },
  function () { console.log(‘done‘); },
);

 

If you have many operators in chain like this, with some arguments in between, then, it means that once you subscribe to the observable that this returns (multiplyBy), that will subscribe to bar, which will subscribe to foo, which will subscribe to the source in the multiplyBy function.