RxJS 是一个用于处理异步和基于事件的编程的库。它采用了响应式编程的思想，让开发者能够更便捷地处理异步数据流。本文将介绍 RxJS 的三个基本步骤：Create、Combine 和 Listen，并通过代码示例来说明它们的用法。
创建（Create）
"创建" 步骤是指在 RxJS 中创建可观察的数据流（Observable）。数据流可以来自多种来源，比如 DOM 事件、HTTP 请求、定时器等。在创建数据流时，我们使用 RxJS 提供的类和函数，如 Subject、fromEvent、of 等。创建数据流是 RxJS 响应式编程的起点。
使用 of 创建 Observable：
import { of } from 'rxjs'
const source = of('Hello', 'World')
source.subscribe(data => console.log('示例1:', data))
// 输出: "示例1: Hello", "示例1: World"
组合（Combine）
"组合" 步骤是指在 RxJS 中组合和转换数据流。一旦创建了多个数据流，我们可以使用 RxJS 的操作符（例如 filter、map 等）来对数据流进行组合、转换和筛选。组合操作可以让我们在数据流之间建立关联，处理复杂的数据流转换需求。
使用 map 和 filter 操作符：
import { interval } from 'rxjs'
import { map, filter } from 'rxjs/operators'
const source = interval(1000) // 创建每秒发出递增整数的数据流
const combined = source.pipe(
map(value => value * 2), // 将每个数据映射为原值的两倍
filter(value => value % 3 === 0) // 筛选出能被3整除的数据
)
combined.subscribe(data => console.log('示例2:', data))
// 输出: "示例2: 0", "示例2: 6", "示例2: 12", "示例2: 18", ...
监听（Listen）
"监听" 步骤是指在 RxJS 中订阅数据流，并对数据流中的数据进行处理。通过订阅数据流，我们可以监听数据的发出，并对数据进行消费。这样，当数据流中有新的数据发出时，我们可以立即执行相应的逻辑来处理这些数据。
监听 DOM 的点击事件：
import { fromEvent } from 'rxjs'
const button = document.getElementById('myButton')
const source = fromEvent(button, 'click')
source.subscribe(() => console.log('示例3: 按钮被点击'))
// 当按钮被点击时，"示例3: 按钮被点击" 将被打印到控制台