First thing need to understand is, Reactive programming is dealing with the event stream.

 

Event streams happens overtime, which not stay in the memory.

 

For example, the array we have:

var source = ['1', '1', 'foo', '2', '3', '5', 'bar', '8', '13'];

Which is stay in the momery.

 

But the stream we have:

let logic = Rx.Observable.interval(400).take(9)
  .map( (i) => {
    let val = ['1', '1', 'foo', '2', '3', '5', 'bar', '8', '13'][i]
    return parseInt(val, 10);
})

Which happens overtime, every 400ms it return an Interge if possible.

 


So the main difference between array stay in memory and the events streams is array already stay in memory and the streams happens overtime.

 

But the nice things about the stream is we can still use the methods we have for array:


RxJS-Reactive-Programming1

let logic = Rx.Observable.interval(400).take(9)
  .map( (i) => {
    let val = ['1', '1', 'foo', '2', '3', '5', 'bar', '8', '13'][i]
    return parseInt(val, 10);
})
  .filter( (number) => {
    return !isNaN(number)
  })
  .reduce( (acc, y) => {
     return acc + y;
  } );

let effect = logic.subscribe( (number) => {
  console.log(number);
});


RxJS-Reactive-Programming2