zoukankan      html  css  js  c++  java
  • [RxJS] Changing Behavior with MapTo

    You often need streams to trigger different behaviors on the data based on which streams triggers. This lessons shows how to use mapTo to pass functions into the scan operator and have completed control over you data.

    Current Code:

    const Observable = Rx.Observable;
    
    const startButton = document.querySelector('#start');
    const stopButton = document.querySelector('#stop');
    
    const start$ = Observable.fromEvent(startButton, 'click');
    const interval$ = Observable.interval(1000);
    const stop$ = Observable.fromEvent(stopButton, 'click');
    
    const intervalThatStops$ = interval$
        .takeUntil(stop$);
    
    const inc = (acc) => ({count: acc.count + 1}); // one line arrow function only ruturn object need ()
    
    const data = {count: 0};
    
    start$
        .switchMapTo(intervalThatStops$)
        .startWith(data)
        .scan( inc )
        .subscribe((x)=> console.log(x));

    Everytime the number 1,2,3... will be passed to the scan function. 

    If we want scan() method be fixable enought, we can use mapTo() method, which accecpts a function to increase the number. Then we need to modify the scan() function, now everytime it receive is the function return from mapTo, not a number anymore.

    start$
        .switchMapTo(intervalThatStops$)
        .mapTo( inc )
        .startWith(data)
        .scan( (acc, curr) => {
          console.log(curr); //(acc) => ({count: acc.count + 1})return curr(acc)
         } )
        .subscribe((x)=> console.log(x));

    Now we get full control over the scan() method, we can let it reset after 10:

    const Observable = Rx.Observable;
    
    const startButton = document.querySelector('#start');
    const stopButton = document.querySelector('#stop');
    
    const start$ = Observable.fromEvent(startButton, 'click');
    const interval$ = Observable.interval(200);
    const stop$ = Observable.fromEvent(stopButton, 'click');
    
    const intervalThatStops$ = interval$
        .takeUntil(stop$);
    
    const data = {count: 0};
    const inc = (acc) => { return Object.assign({}, data, {count: count + 1})};  // avoid modifying data object
    const resetAfterTen = (acc) => {
       if(acc.count == 10){
          return data;
       }else{
         return Object.assign({}, acc, {count: acc.count + 1})
       }
    }
    
    
    
    start$
        .switchMapTo(intervalThatStops$)
        .mapTo( resetAfterTen )
        .startWith(data)
        .scan( (acc, curr) => {
           return curr(acc)
         } )
        .subscribe((x)=> console.log(x));
  • 相关阅读:
    关于Git的使用方法
    Python读取Excel数据
    用到的Dos命令总结 持续更新
    windows下使用Jenkins+Gitea持续集成
    HDFS概述(2)————Block块大小设置
    分布式文件系统比较出名的有HDFS  和 GFS
    c++里面有没有什么办法做到 判断某个给定的未知数是double类型还是int类型 呢?
    About HDFS blocks
    hadoop深入学习之SequenceFile
    使用RawComparator加速Hadoop程序
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5260054.html
Copyright © 2011-2022 走看看