zoukankan      html  css  js  c++  java
  • [RxJS] Filtering operators: distinct and distinctUntilChanged

    Operator distinct() and its variants are an important type of Filtering operator. This lessons shows how they work and in what cases are they useful.

    distinctUntilChanged():

    var foo = Rx.Observable.interval(500).take(5)
      .zip(Rx.Observable.of('a','b','a','a','b'), (x,y)=>y);
    
    /*
    --a--b--a--a--b|
       distinctUntilChanged
    --a--b--a-----b|
    */
    
    var result = foo.distinctUntilChanged();
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );

    distinct(comparFn, flushFn):

    var foo = Rx.Observable.interval(500).take(5)
      .zip(Rx.Observable.of('a','b','a','a','b'), (x,y)=>y);
    
    /*
    --a--b--a--a--b|
       distinct
    --a--b---------|
    */
    
    var result = foo.distinct();
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );
      
      /*
    "next a"
    "next b"
    "done"  
      */

    With CamperFn():

    var foo = Rx.Observable.interval(500).take(5)
      .zip(Rx.Observable.of('a','b','a','A','b'), (x,y)=>y);
    
    
    var comparFn = (x, y) => {
      return x.toLowerCase() === y.toLowerCase();
    }
    
    /*
    --a--b--a--A--b|
       distinct
    --a--b---------|
    */
    
    var result = foo.distinct(comparFn);
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );
      
      /*
    "next a"
    "next b"
    "done"  
      */

    with FlusherFn:

    var foo = Rx.Observable.interval(500).take(5)
      .zip(Rx.Observable.of('a','b','a','A','b'), (x,y)=>y);
    
    
    var comparFn = (x, y) => {
      return x.toLowerCase() === y.toLowerCase();
    }
    
    
    var flushFn = Rx.Observable.interval(1100).take(1)
      .concat(Rx.Observable.never());
    
    /*
    --a--b--a--A--b|
    -------0-------- distinct(comparFn, flushFn) --a--b--a-----b|
    */ var result = foo.distinct(comparFn, flushFn); result.subscribe( function (x) { console.log('next ' + x); }, function (err) { console.log('error ' + err); }, function () { console.log('done'); }, ); /* "next a" "next b" "next a" "next b" "done" */
  • 相关阅读:
    【转】shell处理mysql增删改查
    【转】jenkins_pipeline语法详解
    【原】Jenkins pipeline中资料总结
    【转】使用普通用户执行docker
    【原】linux两台服务器之间免密登录方法
    【原】mac电脑常用快捷建
    【原】Docker学习_Docker上传镜像至docker hub(4)
    项目实战---模拟亿邦动力网
    vue-组件之间的通信:
    vue-为什么子组件中的data选项必须是函数?
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5543920.html
Copyright © 2011-2022 走看看