zoukankan      html  css  js  c++  java
  • rxjs学习笔记

    api List

    Rx.Observable.amb(...args)

    -存在竞争关系,amb里的流只能触发一个,并且忽略其他未处理的流。

    eq:

    <body>
      <input id="input1" type="text">
      <input id="input2" type="text">
    </body>
    import $ from "jquery";
    import Rx from "rx";
    var input1 = $('#input1');
    var input2 = $('#input2');
    var source = Rx.Observable.amb( Rx.Observable.fromEvent(input1, 'click').map(()=>'one'), Rx.Observable.fromEvent(input2, 'click').map(()=>'two') ); var subscription = source.subscribe( function (x) { console.log(x); }, function (err) { console.log('Error: ' + err); }, function () { console.log('Completed'); } );

    订阅了某个事件以后只处理本事件。订阅是普通订阅。

     Rx.Observable.case(selector, sources, [elseSource|scheduler]

     -select是一个筛选函数返回一个字符串,将字符串与sources对象的键值相匹配,发射匹配到的流。后面可选的是未匹配到的情况,默认是Rx.Observable.empty()

    eq:

    import Rx from "rx";
    
    var sources = {
      hello: Rx.Observable.just('clx'),
      world: Rx.Observable.just('wxq') 
    };
    var subscription = Rx.Observable.case(()=>"hello", sources, Rx.Observable.empty())
    
    subscription.subscribe(function(x) {
      console.log(x)
    })

    匹配到hello,就发射Rx.Observable.just('clx')流。

    实际可用于请求后的配置,比如根据ajax配置数据库,

    var config = {
        "database": Observable.return("数据库配置"),
        "cache": Observable.return("缓存配置"),
        "picCDN": Observable.return("图片CDN配置,比如七牛")
    };
    Observable.case(()=>'database', config, Observable.empty())
        .subscribe((databaseConfig) => {
            // 连接数据库
        })
    Observable.case(()=>'picCDN', config, Observable.empty())
        .subscribe((pciCDNConfig) => {
            // 初始化图片CDN
        })

     根据不同配置项进行不同的操作。

    Rx.Observable.catch(...args)

    args都是一个个的观察流,当某一个抛错了,剩下的继续被发射。错误被忽略。subscribe也不会打印。当全部都抛错,会在subscribe的onError里打印。

    eq:

    import Rx from "rx";
    var obs1 = Rx.Observable.throw(new Error('error'));
    var obs2 = Rx.Observable.return(42);
    
    var source = Rx.Observable.catch(obs1, obs2);
    
    var subscription = source.subscribe(
      x => console.log(`onNext: ${x}`),
      e => console.log(`onError: ${e}`),
      () => console.log('onCompleted'));

    obs1抛错以后,42被正常输出。

    项目中可以处理服务商提供服务,当第一个服务商挂掉以后用第二个,全挂掉就抛错吧。

    Rx.Observable.combineLatest(...args, [resultSelector])

    -当两个Observables中的任何一个发射了数据时,使用一个函数结合每个Observable发射的最近数据项,并且基于这个函数的结果发射数据。

    -仔细理解这句话,合并最近发射。

    eq:

    import Rx from "rx";
    
    var colors = ["紫色","黄色","蓝色","黑色"];
    var shapes = ["小星星","圆形","三角形","正方形","心形","五边形"];
    var source1 = Rx.Observable.interval(3000).map(()=>colors.pop());
    var source2 = Rx.Observable.interval(2000).map(()=>shapes.pop());
    
    var combined = Rx.Observable.combineLatest(source1, source2, function(x, y){
      return x + "的" + y;
    }).take(12);
    
    combined.subscribe((shaped)=>console.log(shaped));

    2s时发射五边形,x=五边形,1s后发射黑色,打印,1s后又发射心形,这时x还是黑色,打印黑色的心形。……

    晕。

  • 相关阅读:
    HDU 3415 Max Sum of Max-K-sub-sequence 最长K子段和
    Android Fragment 真正彻底的解决(下一个)
    【数据分析面试题】一个 面试题,我的回答
    Swift初体验(两)
    MyEclipse10.0 集成 SVN
    CFileDialog 打开文件夹文件 保存文件夹文件
    基于thinkphp的uploadify上传图功能
    近20家银行手机银行签名被非法滥用风险分析
    设计模式【6】:适配器模式【接口适配】
    【学习笔记】编译原理-有限自己主动机
  • 原文地址:https://www.cnblogs.com/dh-dh/p/5523514.html
Copyright © 2011-2022 走看看