Autoplay

    Customize Effects from the Main Function

    André StaltzAndré Staltz

    How can we show one string on the DOM, and a completely different string on Console log? This lesson shows how we can make our main function return multiple Observables, each one targeted at a different type of effect.

    cycleCycle.js
    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:01 We now have an application with two types of effects, console log and dom. Both of these display the same string actually. What if we would like to show different strings? How can we show one string in the dom and a completely different one on the console?

    00:17 We cannot use the same sink for both of these functions. Of course we need to have two sinks. How do we that? From our main function, we know we need to return two different streams. We can do that by returning an object for instance. We're going to return an object, and we're going to have under the property let's say DOM, we're going to have this stream.

    00:41 Then under a different property, let's call that for instance log, we're going to have another stream. This is how you can return two values in Java Script. You can just bundle them together. I'm going to make a stream of periodic, let's say every two seconds, and we're going to count numbers. A slightly different type of stream.

    01:06 Down here we're going to get sinks as outputs in many of these streams, and I'm going to pass the DOM sink to the domDriver and the log sink to the logDriver. Once I run this we're going to see different numbers at different times, and unrelated.

    01:24 This is how we can control which data goes to which effect. We should do that specifically in our main function, because this routing of data is basically logic right, and we know logic should live in the main.

    Discuss

    Discuss