# learn-rxjs

**Repository Path**: yanyunchangfeng/learn-rxjs

## Basic Information

- **Project Name**: learn-rxjs
- **Description**: learn RxJs
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 2
- **Created**: 2019-05-28
- **Last Updated**: 2023-06-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

[English](README.en.md) |  简体中文  

<p align="center">
    <img width="300" src="src/assets/img/yanyunchangfeng.png">
</p>

##  介绍
你好，我是[燕云长风](https://yanyunchangfeng.github.io)。  
寓意：结合李白著名的边塞诗《关山月》取【燕云长风】—— 长风几万里，吹度玉门关。

## RXJS讲解演示

## 创建类操作符

*   [formEvent](src/app/create-operators/from-event.ts)   
*   [from](src/app/create-operators/from.ts)   
*   [of](src/app/create-operators/of.ts)   
*   [interval](src/app/create-operators/interval.ts)   
*   [timer](src/app/create-operators/timer.ts)   
*   [never](src/app/create-operators/never.ts)   
*   [throwError](src/app/create-operators/throw-error.ts)   
*   [empty](src/app/create-operators/empty.ts)   
*   [range](src/app/create-operators/range.ts)   
*  [defer](src/app/create-operators/defer.ts)   
*  [generate](src/app/create-operators/generate.ts)   
*  [create](src/app/create-operators/create.ts)   
*  [ajax](src/app/create-operators/ajax.ts)   
*  [fromEventPattern](src/app/create-operators/from-event-pattern.ts)   

## 工具类操作符

*  [tap](src/app/util-operators/tap.ts)   
*  [delay](src/app/util-operators/delay.ts)   
*  [delayWhen](src/app/util-operators/delay-when.ts)   
*  [dematerialize](src/app/util-operators/dematerialize.ts)   
*  [materialize](src/app/util-operators/materialize.ts)   
*  [timeInterval](src/app/util-operators/time-interval.ts)   
*  [timeout](src/app/util-operators/time-out.ts)   
*  [timestamp](src/app/util-operators/time-stamp.ts)   

## 过滤类操作符

* [debounceTime](src/app/filter-operators/debounce-time.ts)   
* [debounce](src/app/filter-operators/debounce.ts)   
* [distinct](src/app/filter-operators/distinct.ts)   
* [distinctUntilChanged](sr*pp/filter-operators/distinct-until-changed.ts)   
* [distinctUntilKeyChanged](src/app/filter-operators/distinct-until-key-changed.ts)   
* [filter](src/app/filter-operators/filter.ts)   
* [reduce](src/app/filter-operators/reduce.ts)   
* [scan](src/app/filter-operators/scan.ts)   
* [take](src/app/filter-operators/take.ts)   
* [takeUtil](src/app/filter-operators/take-until.ts)   
* [first](src/app/filter-operators/first.ts)   
* [last](src/app/filter-operators/last.ts)   
* [throttle](src/app/filter-operators/throttle.ts)   
* [throttleTime](src/app/filter-operators/throttle-time.ts)   
* [audit](src/app/filter-operators/audit.ts)   
* [auditTime](src/app/filter-operators/audit-time.ts)   
* [sample](src/app/filter-operators/sample.ts)   
* [sampleTime](src/app/filter-operators/sample-time.ts)   
* [single](src/app/filter-operators/single.ts)   
* [skipLast](src/app/filter-operators/skip-last.ts)   
* [elementAt](src/app/filter-operators/element-at.ts)   
* [ignore-elements](src/app/filter-operators/ignore-elements.ts)   
* [skipUntil](src/app/filter-operators/skip-until.ts)   
* [takeWhile](src/app/filter-operators/take-while.ts)   
* [skipWhile](src/app/filter-operators/skip-while.ts)   
* [min](src/app/filter-operators/min.ts)   
* [max](src/app/filter-operators/max.ts)   

## 转换类的操作符

* [map](src/app/transform-operators/map.ts) 
* [concatMap](src/app/transform-operators/concat-map.ts) 
* [buffer](src/app/transform-operators/buffer.ts) 
* [bufferCount](src/app/transform-operators/buffer-count.ts) 
* [bufferTime](src/app/transform-operators/buffer-time.ts) 
* [bufferToggle](src/app/transform-operators/buffer-toggle.ts) 
* [bufferWhen](src/app/transform-operators/buffer-when.ts) 
* [exhaustMap](src/app/transform-operators/exhaust-map.ts) 
* [exhaustAll](src/app/transform-operators/exhaustAll.ts) 
* [expand](src/app/transform-operators/expand.ts) 
* [groupBy](src/app/transform-operators/group-by.ts) 
* [pairwise](src/app/transform-operators/pairwise.ts) 
* [partition](src/app/transform-operators/partition.ts) 
* [window](src/app/transform-operators/window.ts) 
* [windowCount](src/app/transform-operators/window-count.ts) 
* [windowToggle](src/app/transform-operators/window-toggle.ts) 
* [windowWhen](src/app/transform-operators/window-when.ts) 
* [windowTime](src/app/transform-operators/window-time.ts) 
* [repeat](src/app/transform-operators/repeat.ts) 
* [toArray](src/app/transform-operators/to-array.ts) 


## 合并类的操作符

* [combineLatest](src/app/merge-operators/combine-latest.ts) 
* [concat](src/app/merge-operators/concat.ts) 
* [merge](src/app/merge-operators/merge.ts) 
* [startWith](src/app/merge-operators/start-with.ts) 
* [zip](src/app/merge-operators/zip.ts) 
* [withLatestFrom](src/app/merge-operators/with-latest-from.ts) 
* [race](src/app/merge-operators/race.ts) 
* [combineLatestAll](src/app/merge-operators/combine-latest-all.ts) 
* [concatAll](src/app/merge-operators/concat-all.ts) 
* [endWith](src/app/merge-operators/end-with.ts) 
* [forkJoin](src/app/merge-operators/fork-join.ts) 

## 条件类的操作符

*  [defaultIfEmpty](src/app/conditional-operators/default-if-empty.ts)  
*  [iif](src/app/conditional-operators/iif.ts) 
*  [find](src/app/conditional-operators/find.ts) 
*  [findIndex](src/app/conditional-operators/find-index.ts) 
*  [count](src/app/conditional-operators/count.ts) 
*  [every](src/app/conditional-operators/every.ts) 
*  [squenceEqual](src/app/conditional-operators/squence-equal.ts) 


## 高阶操作符

* [mergeMap](src/app/senior-operators/merge-map.ts) 
* [switchMap](src/app/senior-operators/switch-map.ts) 
* [mergeScan](src/app/senior-operators/merge-scan.ts) 
* [mergeAll](src/app/senior-operators/merge-all.ts) 

## 多播操作符

* [share](src/app/multicast-operators/share.ts)  
* [shareReplay](src/app/multicast-operators/share-replay.ts)  

## Subject Class

* [Subject](src/app/subject-class/subject.ts) 
* [BehaviorSubject](src/app/subject-class/behavior-subject.ts) 
* [ReplaySubject](src/app/subject-class/replay-subject.ts) 
* [AsyncSubject](src/app/subject-class/replay-subject.ts) 

## 自定义操作符

* [takeEveryNth](src/app/custom-operators/takeEveryNth.ts)

## Observable Custom

*  [Observable](src/app/my-observable/index.ts)  


## 系列项目

|  名称   | 描述  |
|  ----  | ----  |
| NiceFish（美人鱼）  | 这是一个系列项目，目标是示范前后端分离的开发模式:前端浏览器、移动端、Electron 环境中的各种开发模式。后端有两个版本：SpringBoot 版本和 SpringCloud 版本，http://git.oschina.net/mumu-osc/NiceFish/ |
| NiceFish-React  |  这是 NiceFish 的 React 版本，基于React 18.0.0 ，使用 Antd、Inversify、 定制版 Bootstrap开发。  https://gitee.com/mumu-osc/NiceFish-React|
| nicefish-ionic  | 这是一个移动端的 demo，基于 ionic，此项目已支持 PWA。http://git.oschina.net/mumu-osc/nicefish-ionic |
| NiceBlogElectron  | 这是一个基于 Electron 的桌面端项目，把 NiceFish 用 Electron 打包成了一个桌面端运行的程序。这是由 ZTE 中兴通讯的前端道友提供的，我 fork 了一个，有几个 node 模块的版本号老要改，如果您正在研究如何利用 Electron 开发桌面端应用，请参考这个项目，https://github.com/damoqiongqiu/NiceBlogElectron|
| OpenWMS  | 用来示范管理后台型系统的最佳实践，https://gitee.com/mumu-osc/OpenWMS-Frontend|
| nicefish-springboot  | 用来示范前后端分离模式下，前端代码与后端服务的对接方式，已经完成了基线版本，并且在腾讯云上面做了实际的部署。代码仓库在这里： https://gitee.com/mumu-osc/nicefish-spring-boot ，腾讯云上的演示地址在这里： http://118.25.136.164 ，以此为基础，你可以继续开发出适合自己业务场景的代码。|
| nicefish-springcloud  | 用来示范前后端分离模式下，前端代码与分布式后端服务的对接方式，即将完成，代码最近放出。|                                                                                                     
## 单元测试

```
   yarn test or npm run test 
```               
## 打包分析

```
   yarn build-analyzer or npm run build-analyzer  
```               
## 社交主页

* [燕云长风知乎](https://zhihu.com/people/hbxyxuxiaodong)
* [燕云长风 github](https://github.com/yanyunchangfeng)
* [燕云长风 gitee](https://gitee.com/yanyunchangfeng)

## 开源许可证

MIT