zoukankan      html  css  js  c++  java
  • [rxjs] Demystifying Cold and Hot Observables in RxJS

    Cold:

    console.clear();
    var Observable = Rx.Observable;
    var clock = Observable.interval(1000).take(10).map((i) => `${i}!`);
    clock.subscribe((x) => {
      console.log(` a  ${x}`);
    });
    
    setTimeout(function(){
      clock.subscribe((x) => {
        console.log(`         b    ${x}`);
      });
    }, 3500);

    Results:

    /*
    " a  0!"
    " a  1!"
    " a  2!"
    " a  3!"
    "         b    0!"
    " a  4!"
    "         b    1!"
    " a  5!"
    "         b    2!"
    " a  6!"
    "         b    3!"
    " a  7!"
    "         b    4!"
    " a  8!"
    "         b    5!"
    " a  9!"
    "         b    6!"
    "         b    7!"
    "         b    8!"
    "         b    9!"
    */

    As you can see, 'a' and 'b' all start from '0'. They are independent. As youtube vedio, you can open the same vedio in tow tabs. When you click play, those two vedio will play independently. 

    Hot: publish().refCount();

    Hot Observables are like 'live' youtube video, everyone watch the same vedio at the same pace. 

    As I wrote in previous article about publish(); you can use this with connect() funciton, but there is problem, we will miss the very first event.

    RefCount and a hot observable is analogous to a live video of a band playing at a concert, but the band doesn't start playing if there isn't anyone in the audience. That would be a waste, right? So, why play if there is no one watching?

    RefCount tells the band to play when there is at least one person in the audience, in other words, when the number of observers goes from zero to one.

    console.clear();
    var Observable = Rx.Observable;
    var clock = Observable.interval(1000).take(10).map((i) => `${i}!`).publish().refCount();
    clock.subscribe((x) => {
      console.log(` a  ${x}`);
    });
    
    setTimeout(function(){
      clock.subscribe((x) => {
        console.log(`         b    ${x}`);
      });
    }, 3500);

    Results:

    /*" a  0!"
    " a  1!"
    " a  2!"
    " a  3!"
    "         b    3!"
    " a  4!"
    "         b    4!"
    " a  5!"
    "         b    5!"
    " a  6!"
    "         b    6!"
    " a  7!"
    "         b    7!"
    " a  8!"
    "         b    8!"
    " a  9!"
    "         b    9!"
    */
  • 相关阅读:
    F5 BIG-IP之一前期随笔(应用交付网络产品)
    F5 BIG-IP LTM负载均衡策略
    OA-APP增加空间
    如何在Windows服务器上新建一个Powershell.ps1的定时任务
    领益科技:查询AD中被锁定的账号并进行解锁
    使用Python创建简单的HTTP和FTP服务器
    Mysql binlog日志太多,占用大量磁盘空间该如何正确处理
    【vspher运维】ESXI 日志文件
    【vsphere运维】ESXI命令行操作虚拟机
    内容图片切换
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4755170.html
Copyright © 2011-2022 走看看