Autoplay

    Subject: an Observable and Observer hybrid

    André StaltzAndré Staltz

    This lesson teaches you how a Subject is simply a hybrid of Observable and Observer which can act as a bridge between the source Observable and multiple observers, effectively making it possible for multiple observers to share the same Observable execution.

    rxjsRxJS
    ^5.0.0
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    00:00 We want to have observer A and observer B see the same execution of the observable, but we know that when we subscribe, it will create a new execution. If we want to have just one execution, it means that we can only have one subscribe. We cannot have this one over here, for instance.

    00:17 Subscribe can only take one argument, one observer. Instead of favoring observer A and forgetting about observer B, here's an interesting idea. We could instead make a third observer, called a bridge observer.

    00:34 This will be an intermediate between A and B. Let's create the bridge observer. As you can see, it is an observer because it has these three functions, next, error, and complete. It also has here an array of its child observers.

    00:50 It has also a function called add observer, where you can pass an observer here, and that will be simply added to that array of observers. When the bridge receives an event from the execution, when it receives a next event, it will relay that to its child observers.

    01:10 For each of its child observers, it's just going to pass that to the observer. Now that we have the bridge observer subscribed, we have only one subscription, which means just one execution. Then we need to add those child observers to the bridge just by calling the add observer function, giving observer A, which starts immediately.

    01:39 B as well, instead of subscribing, it will be simply added to the bridge. Now when we run this, we're going to see just one execution because we have just one subscribe. As you can see, B is added to the bridge after two seconds, and it shares the same execution as A was seeing.

    01:59 OK. That actually solves the problem. If you notice here, observers are meant for observing observable things. We have effectively, observer A observing the bridge. We also have observer B observing the bridge.

    02:18 That sounds like the bridge is observable. In fact, if you change the name of add observer to subscribe, then the bridge suddenly really looks like an observable because it has the same API here, where you can register the observer inside the bridge.

    02:41 Now it seems like the bridge is a hybrid. The bridge is an observer, definitely. It also looks like an observable. That's, in fact, what a subject is. Let's introduce now a subject. You create the subject by saying, "new Rx subject."

    03:03 There you go. A subject is an observer, and a subject is also an observable. We can just use subject here instead of bridge. This should also work. As you can see, after two seconds, B comes in. They share the same execution.

    03:24 A subject is not, anyhow, a scary concept. It is really an observer, and also an observable, because it has a subscribe. It has more than just those two. It also has operators, just like an observable has operators, like map and etc.

    03:42 A subject also has methods attached to it, such as map, filter, reduce, and etc. It really behaves like an observable. It has all the operators. It has subscribe. It also behaves like an observer. It has next, error, and complete. That's how it can act as a bridge between the actual observable and multiple observers, like A and B.

    Discuss

    Discuss