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还是黑色,打印黑色的心形。……

晕。

rxjs学习笔记的更多相关文章

  1. RxJS学习笔记之Subject

    本文为原创文章,转载请标明出处 目录 Subject BehaviorSubject ReplaySubject AsyncSubject 1. Subject 总的来说,Subject 既是能够将值 ...

  2. Angular4学习笔记(十)- 组件间通信

    分类 父子组件通信 非父子组件通信 实现 父子 父子组件通信一般使用@Input和@Output即可实现,参考Angular4学习笔记(六)- Input和Output 通过Subject 代码如下: ...

  3. ReactiveX 学习笔记(0)学习资源

    ReactiveX 学习笔记 ReactiveX 学习笔记(1) ReactiveX 学习笔记(2)创建数据流 ReactiveX 学习笔记(3)转换数据流 ReactiveX 学习笔记(4)过滤数据 ...

  4. Angular快速学习笔记(2) -- 架构

    0. angular 与angular js angular 1.0 google改名为Angular js 新版本的,2.0以上的,继续叫angular,但是除了名字还叫angular,已经是一个全 ...

  5. Angular 快速学习笔记(1) -- 官方示例要点

    创建组件 ng generate component heroes {{ hero.name }} {{}}语法绑定数据 管道pipe 格式化数据 <h2>{{ hero.name | u ...

  6. 《Angular4从入门到实战》学习笔记

    <Angular4从入门到实战>学习笔记 腾讯课堂:米斯特吴 视频讲座 二〇一九年二月十三日星期三14时14分 What Is Angular?(简介) 前端最流行的主流JavaScrip ...

  7. Angularjs2 学习笔记

    angularjs2 学习笔记(一) 开发环境搭建   开发环境,vs2013 update 5,win7 x64,目前最新angular2版本为beta 17 第一步:安装node.js 安装nod ...

  8. Angular6 学习笔记——路由详解

    angular6.x系列的学习笔记记录,仍在不断完善中,学习地址: https://www.angular.cn/guide/template-syntax http://www.ngfans.net ...

  9. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

随机推荐

  1. Laravel自带SMTP邮件组件实现发送邮件(QQ、163、企业邮箱都可)

    Laravel自带SMTP邮件组件实现发送邮件(QQ.163.企业邮箱都可)     laravel自带SMTP邮件配置和遇到的坑 laravel自带SwiftMailer库,集成了多种邮件API,可 ...

  2. 非关系型数据库----MongoDB

    一.什么是MongoDB? MongoDB 是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统. 在高负载的情况下,添加更多的节点,可以保证服务器性能. MongoDB 旨在为WEB应用提 ...

  3. elasticsearch概念及倒排索引简单介绍

    一.概念 集群:一个或者多个节点组织在一起 节点:一个节点是集群中的一个服务器,由一个名字来标识,默认是一个随机的漫威角色名字. 分片:将索引划分为多份的能力,允许水平分割和扩展容量,多个分片相应请求 ...

  4. ArcGIS中使用异步回调函数查询图层Graphic

    在我们的地图的操作中经常会有一些操作是需要通过画多边形或者画线来查找某一块区域内的特定的Graphics比如我们在做的交警的项目中通过框选来查找某一块区域中的摄像机,某一块区域中的警力.警情.警员等相 ...

  5. CSS3圆角详解(border-radius)

    1.CSS3圆角的优点 传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,而且还有其他多个优点: 减少维护的工作量.图片文件的生成.更新.编写 ...

  6. scrapy的一些容易忽视的点(模拟登陆,传递item等)

    scrapy爬虫注意事项 一.item数据只有最后一条 这种情况一般存在于对标签进行遍历时,将item对象放置在了for循环的外部.解决方式:将item放置在for循环里面.   二.item字段传递 ...

  7. div中的相对定位与绝对定位

    1.position:relative; 如果对一个元素进行相对定位,首先它将出现在它所在的位置上.然后通过设置垂直或水平位置,让这个元素“相对于”它的原始起点进行移动.(再一点,相对定位时,无论是否 ...

  8. 使用PHP进行SOCKET编程

    一.SOCKET原理图 二.SOCKET常用函数 1.创建socket函数: resource socket_create ( int $domain , int $type , int $proto ...

  9. Delphi窗体之间互相调用的简单问题

    问题是这样的,我的程序主窗口Form1上面有一个数据连接(ADOCONNECTION1)和ADOQUERY,然后还有一些数据感知组件用于浏览用的,我打算点击From1中的一个“修改数据”按钮,就弹出F ...

  10. Map接口----Map中嵌套Map

    package cn.good.com; import java.util.HashMap; import java.util.Iterator; import java.util.Map; impo ...