rxjs笔记(未完成)
首先是 Observable 和promise的区别,
1返回值个数,Observable 可以返回0到无数个值。
2.Promise主动推送,控制着"值"何时被 "推送 "到回调函数。
Observable 被动,没有被订阅的时候,它就什么也不做,而且,它既可以是同步的,又可以是异步的。
import { Observable } from 'rxjs';
const foo = new Observable(subscriber => {
console.log('Hello');
subscriber.next(42);
subscriber.next(100);
subscriber.next(200);
setTimeout(() => {
subscriber.next(300); // happens asynchronously
}, 1000);
});
console.log('before');
foo.subscribe(x => {
console.log(x);
});
console.log('after');
/*结果:
"before"
"Hello"
42
100
200
"after"
300*/
操作符(operator)有两种。一种是(Pipeable Operator)对返回的数据做中间处理。不改变输入(纯函数)。它把一个 Observable 作为输入,并生成另一个 Observable 作为输出。
另外一种可以直接创建新的Observable(Creation Operator)。比如 of(1,2,3)创建一个Observable ,它将发出1,2,3,一个接着一个。
import { of } from 'rxjs';
import { map } from 'rxjs/operators';
map(x => x * x)(of(1, 2, 3)).subscribe((v) => console.log(`value: ${v}`));
same as
// Logs:
// value: 1
// value: 4
// value: 9
退订(unsubscribe):
import { interval } from 'rxjs';
const observable1 = interval(400);
const observable2 = interval(300);
const subscription = observable1.subscribe(x => console.log('first: ' + x));
const childSubscription = observable2.subscribe(x => console.log('second: ' + x));
subscription.add(childSubscription);
setTimeout(() => {
// Unsubscribes BOTH subscription and childSubscription
subscription.unsubscribe();
}, 1000);
//second: 0 first: 0 second: 1 first: 1 second: 2
多播(Subject)既是Observable也是Observer, 类似于eventEmitter,当一个订阅者 subscribe Subject时,它并不会执行什么,而是会将订阅者注册到订阅者列表里。(类似于addListener )
import { Subject } from 'rxjs'; const subject = new Subject<number>(); subject.subscribe({
next: (v) => console.log(`observerA: ${v}`)
});
subject.subscribe({
next: (v) => console.log(`observerB: ${v}`)
}); subject.next(1);
subject.next(2);
same as
// Logs:
// observerA: 1
// observerB: 1
// observerA: 2
// observerB: 2
高阶Observable :
处理Observable的Observable
扁平化操作符(flattening operator)
concatAll()mergeAll()switchAll()exhaust()flatMap()concatMap()mergeMap()switchMap()exhaustMap().
Creation Operators
ajaxbindCallbackbindNodeCallbackdeferemptyfromfromEventfromEventPatterngenerateintervalofrangethrowErrortimeriif
Join Creation Operators
These are Observable creation operators that also have join functionality -- emitting values of multiple source Observables.
Transformation Operators
bufferbufferCountbufferTimebufferTogglebufferWhenconcatMapconcatMapToexhaustexhaustMapexpandgroupBymapmapTomergeMapmergeMapTomergeScanpairwisepartitionpluckscanswitchMapswitchMapTowindowwindowCountwindowTimewindowTogglewindowWhen
Filtering Operators
auditauditTimedebouncedebounceTimedistinctdistinctKeydistinctUntilChangeddistinctUntilKeyChangedelementAtfilterfirstignoreElementslastsamplesampleTimesingleskipskipLastskipUntilskipWhiletaketakeLasttakeUntiltakeWhilethrottlethrottleTime
Join Operators
Also see the Join Creation Operators section above.
Multicasting Operators
Error Handling Operators
Utility Operators
tapdelaydelayWhendematerializematerializeobserveOnsubscribeOntimeIntervaltimestamptimeouttimeoutWithtoArray
Conditional and Boolean Operators
Mathematical and Aggregate Operators
rxjs笔记(未完成)的更多相关文章
- 莫队学习笔记(未完成QAQ
似乎之前讲评vjudge上的这题的时候提到过?但是并没有落实(...我发现我还有好多好多没落实?vjudge上的题目还没搞,然后之前考试的题目也都还没总结?天哪我哭了QAQ 然后这三道题我都是通过一道 ...
- [未完成]WebService学习第一天学习笔记
[未完成]WebService学习第一天学习笔记[未完成]WebService学习第一天学习笔记
- java中基本输入输出流的解释(flush方法的使用)
转自:http://fsz521job.itpub.net/post/5606/34827 网络程序的很大一部分是简单的输入输出,即从一个系统向另一个系统移动字节.字节就是字节,在很大程度上,读服务器 ...
- angular2 学习笔记 ( rxjs 流 )
RxJS 博大精深,看了好几篇文章都没有明白. 范围牵扯到了函数响应式开发去了... 我对函数式一知半解, 响应式更是第一次听到... 唉...不过日子还是得过...混着过先呗 我目前所理解的很浅, ...
- angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )
Promise 是 ES 6 Async/Await 是 ES 7 Rxjs 是一个 js 库 在使用 angular 时,你会经常看见这 3 个东西. 它们都和异步编程有关,有些情况下你会觉得用它们 ...
- ReactiveX 学习笔记(28)使用 RxJS + React.js 进行 GUI 编程
课题 程序界面由3个文本编辑框和1个文本标签组成. 要求文本标签实时显示3个文本编辑框所输入的数字之和. 文本编辑框输入的不是合法数字时,将其值视为0. 3个文本编辑框的初值分别为1,2,3. 创建工 ...
- ReactiveX 学习笔记(27)使用 RxJS + Vue.js 进行 GUI 编程
课题 程序界面由3个文本编辑框和1个文本标签组成. 要求文本标签实时显示3个文本编辑框所输入的数字之和. 文本编辑框输入的不是合法数字时,将其值视为0. 3个文本编辑框的初值分别为1,2,3. 创建工 ...
- ReactiveX 学习笔记(26)使用 RxJS + React.js 调用 REST API
JSON : Placeholder JSON : Placeholder (https://jsonplaceholder.typicode.com/) 是一个用于测试的 REST API 网站. ...
- ReactiveX 学习笔记(25)使用 RxJS + Vue.js 调用 REST API
JSON : Placeholder JSON : Placeholder (https://jsonplaceholder.typicode.com/) 是一个用于测试的 REST API 网站. ...
- ReactiveX 学习笔记(22)使用 RxJS + Angular 进行 GUI 编程
课题 程序界面由3个文本编辑框和1个文本标签组成. 要求文本标签实时显示3个文本编辑框所输入的数字之和. 文本编辑框输入的不是合法数字时,将其值视为0. 3个文本编辑框的初值分别为1,2,3. 创建工 ...
随机推荐
- .netcore全局异常处理
一.背景 某天,应用程序进程无缘无故退出,也就是我们通常说的崩溃.通常情况下,windows事件会记录一条消息.但是有时候,我们发现这样的信息,对于查找问题,还是远远不够的,因为它说RunTime报错 ...
- LeetCode算法训练-动态规划
欢迎关注个人公众号:爱喝可可牛奶 LeetCode算法训练-动态规划 理论知识 动态规划当前状态是由前一个状态推导出来的,而贪心没有状态的转移 动态规划需要借助dp数组,可能是一维也可能是二维的 首先 ...
- 从安装开发环境到第一个“hello world”
安装Java8 为什么要安装java8? java8和小破站的教程同步. 安装方法: 1.官网安装(我踩雷了,下载得慢,不过最后安装成功了!) 2.镜像网站:清华镜像 3.公众号(网上的全是套路了) ...
- Vue mixin混入的介绍
功能:可以把多个组件共用的配置提取成一个混入对象 使用方式: 1.第一步:定义混合,例如: 2.第二步:使用混合(全局混合和局部混合) (1)局部混合 mixins:['XXX'] (2)全局混合 V ...
- 若依-更换数据库-sqlite
基础 我是在ruoyi-vue已经安装了mybatis-plus的基础上进行的修改 关于SQLite SQLite 是一个软件库,实现了自给自足的.无服务器的.零配置的.事务性的 SQL 数据库引擎. ...
- SFC-系统文件检查器
Microsoft (R) Windows (R) Resource Checker 6.0 版 版权所有 (C) Microsoft Corporation.保留所有权利. 扫描所有保护的系统文件的 ...
- ARC157E XXYX Binary Tree 题解
首先,条件可以抽象为 Y 不能相连,然后: 钦定根为 Y,YX 的个数加上 \(2\): 钦定某一个叶子节点为 Y,XY 的个数加上 \(1\): 钦定某一个非叶子非根节点为 Y,YX 的个数加上 \ ...
- python + pyqt 实现的你下载css背景图片的小工具(最终版)
学习python有三个星期了,算是做的第一个小工具,其实也没必要做成图形界面,只是为的GUI学习(再说技术总归给人使用的,熟练很多shell命令只是个"匠人".) win8下面: ...
- Android MVP框架 详细代码
android mvp的好处,网上一搜一大堆,相对于一开始普通的在activity中处理所有的不管是网络请求还是页面渲染,最大的好处是简洁了,废话不多说,看代码 这里网络请求使用了两种,一种是自己封装 ...
- MSF内网信息收集
1. msf通过shell关闭防火墙 Netsh advfirewall set allprofiles state off(关闭防火墙) Netsh advfirewall show allprof ...