RxJS 是一个强大的 JavaScript 库，用于处理异步事件和流。无论您是前端开发人员还是后端开发人员，都可以使用 RxJS 通过创建可观察对象以及操作它们来简化异步编程。
在 RxJS 中，可观察对象包含多个值，并且可以发出这些值以进行进一步处理。本文将详细介绍如何向流中动态添加数据，在订阅器内接收新数据。
在可观察对象中动态向流添加数据
当我们从网络请求或用户输入等源获取数据时，我们可以将其作为初始流提供给 RxJS。但是，有时我们需要在可观察对象中动态添加一些数据。
在 RxJS 中，我们可以使用 Subject 这个对象类型来完成该任务。 Subject 是一种 Observable 对象，但同时也充当了观察者的角色，因此可以使用 Next 方法来将数据推入管道并重新发射。
以下示例演示如何创建一个 Subject 对象，并将数据提交到它：
import { Subject } from 'rxjs';
const subject = new Subject<string>(); // 创建一个字符串类型的 Subject 对象
// 向 Subject 对象添加数据
subject.next('First item');
subject.next('Second item');上述示例首先导入 Subject 类型，然后创建一个字符串类型的 Subject 对象，最后通过 next 方法向它添加两个字符串元素。 现在你可以在订阅者内接收新添加的数据！
如何从 Subject 对象中获取数据
除了将数据动态添加到已有的流中，我们还需要一种方法来访问这些数据。订阅一个 Subject 对象就可以完成此操作。
示例代码：
subject.subscribe({
next: (data) => console.log(data), // 此处是一个回调函数，用于接收发出的值
error: (error) => console.log(error), // 错误处理
complete: () => console.log('Complete!') // 完成流时，在控制台上显示 “Complete!” 信息。
});此代码段展示了如何为 Subject 对象订阅一个观察者，以获取它产生的所有值。 当您运行代码时，会在控制台中看到 First item 和Second item，表示顺利接收数据。
让我们改进下我们的代码，将其使用 TypeScript 的方式重构，并加入异常和取消订阅处理的代码：
-- -------------------- ---- ------- ------ - -------- -------- - ---- ------- -- -- ---------- ---- -------- -- ----- ------- - --- ------------------ ----- --------- ---------------- - - ----- ------ ------- -- ------------------ ------ ------- ------ -- --------------------- --------- -- -- ------------------------- -- ----- ------------ - ---------------------------- -- -------------------- ---------------------------
在这个重构后的代码段，我们使用了更干净，类型化的观察者接口。 我们订阅了一个 Subject 对象并将其映射到变量 subscription 中以便取消订阅。 这样就能大大优化内存使用和性能问题。
总结
RxJS 是一个极为强大和灵活的库，它可以处理异步编程中的多个事件，并使代码逻辑流程简单易懂。 使用 Subject 可以向管道中动态添加数据，并通过在可观测对象上订阅观察者获取它们。希望这篇文章对您有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/650274e295b1f8cacdfbd2ed