zoukankan      html  css  js  c++  java
  • [RxJS] Transformation operators: debounce and debounceTime

    Debounce and debounceTime operators are similar to delayWhen and delay, with the difference that they may drop some emissions. This lesson teaches you how debounce works and where is it useful, for instance when building a type-ahead UI.

    debounceTime(number): wait for number millionseconds sclience:

    var foo = Rx.Observable.interval(100).take(5);
    
    /*
    --0--1--2--3--4|
      debounceTime(1000) // delay
    ------------------------4|
    */
    
    var result = foo.debounceTime(1000);
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );
    
      /*
    "next 4"
    "done"  
      */
    var foo = Rx.Observable.interval(100).take(5);
    
    /*
    --0--1--2--3--4|
      debounceTime(50) // delay
    ----0--1--2--3--4|
    */
    
    var result = foo.debounceTime(50);
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );
    
      /*
    "next 0"
    "next 1"
    "next 2"
    "next 3"
    "next 4"
    "done" 
      */

    debounce( () => Observable): 

    var foo = Rx.Observable.interval(100).take(5);
    
    /*
    --0--1--2--3--4|
      debounceTime(1000) // delay
    ------------------------4|
    */
    
    var result = foo.debounce(() =>
      Rx.Observable.interval(1000).take(1)
    );
    
    result.subscribe(
      function (x) { console.log('next ' + x); },
      function (err) { console.log('error ' + err); },
      function () { console.log('done'); },
    );
    
      /*
    "next 4"
    "done"  
      */
  • 相关阅读:
    魔方
    js烟花特效
    面试cookie
    扩展日期插件
    通过javascript实现1~100内能同时被2和3整除的数并生成如下表格
    用三或四个个div标签实现工字效果
    2015_WEB页面前端工程师_远程测题_东方蜘蛛_1
    js公有、私有、静态属性和方法的区别
    Docker libnetwork(CNM)设计简介
    kubernetes,Docker网络相关资料链接
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5543751.html
Copyright © 2011-2022 走看看