Skip to content

Instantly share code, notes, and snippets.

@orod
Last active February 11, 2018 04:14
Show Gist options
  • Save orod/37a97fb3c8f8188386d5d24476f50cce to your computer and use it in GitHub Desktop.
Save orod/37a97fb3c8f8188386d5d24476f50cce to your computer and use it in GitHub Desktop.
Subject, ReplaySubject, BehaviorSubject in RxJS

1 source, Three subscribers
Subscriber 1 subscribes and source starts emitting
Subscriber 2 subscribes halfway
Subscriber 3 subscribes after source has completed.

import Rx from 'rxjs/Rx';

var data = [];

var subject = new Rx.ReplaySubject(1);
// var subject = new Rx.BehaviorSubject(data);
// var subject = new Rx.Subject();

setTimeout(function () {
    // Clean up
    subject.complete();
    clearInterval(myInterval);
}, 10000);

var subSubject1 = subject.subscribe(
    function (x) { console.log('Value published to observer 1: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('onCompleted 1'); });

setTimeout(function () {
    var subSubject2 = subject.subscribe(
      function (x) { console.log('Value published to observer 2: ' + x); },
      function (e) { console.log('onError: ' + e.message); },
      function () { console.log('onCompleted 2'); }
    );
}, 5000);

setTimeout(function () {
    var subSubject3 = subject.subscribe(
      function (x) { console.log('Value published to observer 3: ' + x); },
      function (e) { console.log('onError: ' + e.message); },
      function () { console.log('onCompleted 3'); }
    );
}, 12000);

var myInterval = setInterval(function () {
    data.push(data.length);
    subject.next(data);
}, 1000);

With var subject = new Rx.ReplaySubject(1);

Value published to observer 1: 0 index.js:31 Value published to observer 1: 0,1
index.js:31 Value published to observer 1: 0,1,2
index.js:31 Value published to observer 1: 0,1,2,3
index.js:61 Value published to observer 2: 0,1,2,3
index.js:31 Value published to observer 1: 0,1,2,3,4
index.js:61 Value published to observer 2: 0,1,2,3,4
index.js:31 Value published to observer 1: 0,1,2,3,4,5
index.js:61 Value published to observer 2: 0,1,2,3,4,5
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7,8
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7,8
index.js:35 onCompleted 1
index.js:65 onCompleted 2
index.js:71 Value published to observer #3: 0,1,2,3,4,5,6,7,8
index.js:75 onCompleted 3

With var subject = new Rx.BehaviorSubject(data);

Value published to observer 1:
index.js:31 Value published to observer 1: 0
index.js:31 Value published to observer 1: 0,1
index.js:31 Value published to observer 1: 0,1,2
index.js:31 Value published to observer 1: 0,1,2,3
index.js:61 Value published to observer 2: 0,1,2,3
index.js:31 Value published to observer 1: 0,1,2,3,4
index.js:61 Value published to observer 2: 0,1,2,3,4
index.js:31 Value published to observer 1: 0,1,2,3,4,5
index.js:61 Value published to observer 2: 0,1,2,3,4,5
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7,8
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7,8
index.js:35 onCompleted 1
index.js:65 onCompleted 2
index.js:75 onCompleted 3

With var subject = new Rx.Subject();

Value published to observer 1: 0
index.js:31 Value published to observer 1: 0,1
index.js:31 Value published to observer 1: 0,1,2
index.js:31 Value published to observer 1: 0,1,2,3
index.js:31 Value published to observer 1: 0,1,2,3,4
index.js:61 Value published to observer 2: 0,1,2,3,4
index.js:31 Value published to observer 1: 0,1,2,3,4,5
index.js:61 Value published to observer 2: 0,1,2,3,4,5
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7
index.js:31 Value published to observer 1: 0,1,2,3,4,5,6,7,8
index.js:61 Value published to observer 2: 0,1,2,3,4,5,6,7,8
index.js:35 onCompleted 1
index.js:65 onCompleted 2
index.js:75 onCompleted 3

====

BehaviorSubject emits initial value (before next() happens)
Subject, ReplaySubject emits on next(), not initial value

ReplaySubject returns value even after complete()
Subject, BehaviorSubject do not

ReplaySubject, BehaviorSubject give the current value on subscription
Subject emits on next()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment