[RxJS] BehaviorSubject: representing a value over time

When an Observer subscribe to a BehaviorSubject. It receivces the last emitted value and then all the subsequent values. BehaviorSubject requires that we provide a starting value, so taht all Observers will always receive a value when they subscribe to a BehaviorSubject.

 

Imagine we want to retreve a remote file and print its contents on an HTML page, but we wnat placeholder text while we wait for the contents. We can use a BehaviorSubject for this.

 

var subject = new Rx.BehaviorSubject('Waiting for content');
subject.subscribe(
function(result) {
  document.body.textContent = result.response || result;
},
function(err) {
  document.body.textContent = 'There was an error retrieving content';
}
);
Rx.DOM.get('/remote/content').subscribe(subject);

 

Example 2:

var subject = new Rx.BehaviorSubject(0);

var observerA = {
  next: function (x) { console.log('A next ' + x); },
  error: function (err) { console.log('A error ' + err); },
  complete: function () { console.log('A done'); },
};

subject.subscribe(observerA);
console.log('observerA subscribed');

var observerB = {
  next: function (x) { console.log('B next ' + x); },
  error: function (err) { console.log('B error ' + err); },
  complete: function () { console.log('B done'); },
};

subject.next(1);
subject.next(2);
subject.next(3);


/*
0---1---2---3---------------
 0..1...2...3...
                      3.....
*/

setTimeout(function () {
  subject.subscribe(observerB);
  console.log('observerB subscribed');
}, 2000);

/*

"A next 0"  <-- Always get the init value
"observerA subscribed"
"A next 1"
"A next 2"
"A next 3"
"B next 3" <-- Because A & B share the same observer, B will receive last emit value
"observerB subscribed"

*/