javascript - Observables (Rx.js) 与 ES2015 生成器相比如何？

Question

据我了解，解决异步编程工作流程的技术如下:

1. 回调 (CSP)
2. promise

新方法:

1. Rx.js Observables(或mostjs、bacon.js、xstream 等)
2. ES6 生成器
3. 异步/等待

我们现在正在从回调和 promise 转向这些新方法。我目前的理解是 - Async/Await 更像是 ES2015 生成器之上的更清晰的抽象。

我无法理解的是 Observables 和 Generators 之间的概念差异。我已经广泛使用了它们，并且使用它们没有任何问题。

令我困惑的是 Observables 和 Generators 的用例。我得出的结论是，最终他们正在解决同一个问题——异步性。我看到的唯一潜在区别是生成器本质上为代码提供了命令式语义，而使用 Rxjs 的 Observables 似乎提供了响应式(Reactive)范例。但就是这样吗？

这应该是在 Observable 和 Generator 之间进行选择的标准吗？有什么优点和缺点。

我是否错过了大局？

随着 Observable 最终成为 future 的 Ecmascript，Promises(带有可取消 token )/Observable/Generator 是否会相互竞争？

Answer 1

可观察量插入变化，因此控制的是可观察量，而不是对其使用react的函数。另一方面，生成器要求您从中提取值。因此，将对新值使用react的函数决定何时准备好接受新值。

我在使用可观察量时遇到了背压问题，但是使用生成器，您可以按照自己的意愿缓慢地释放值。

编辑:最后一个问题。 Promise 只是可观察的对象，只发出一次，所以我认为它们不会相互竞争。我认为真正的战斗将是 async/await 与 observables，async/await 已经领先，并且已经在 C# 中(现在是 Node.js)了。但可观察量有那种甜蜜的 FRP 感觉，而且函数式编程非常酷，所以我认为它们最终都会获得很大的关注。

Edit2:André Staltz，Cycle.js 和 xstream 的作者，以及 Rx.js 的贡献者，写了一篇关于生成器和 Observables 如何关联的很棒文章(于 2018 年 1 月 31 日)。他特别展示了它们如何从共同的基类继承。

And now a consumer can be a Listener (“observer”) or a Puller, it’s up to the consumer whether it will pull the producer or not. And the producer can be a Listenable (“observable”) or a Pullable (“iterable”), it’s up to the producer whether it sends data proactively or only on demand. As you can see, both consumer and producer are simple functions of the same type:

(num, payload) => void

So any operator that we build will work for both reactive programming or iterable programming, simply because the line between those two modes gets blurred and it’s not anymore about observables versus iterables, it’s just about transformations of data between producer and consumer.

我建议阅读它[ link ]。本文介绍了“Callbags ”，这是用于响应式(Reactive)和可迭代编程的回调规范。他实现了该规范来制作 a tiny library适用于可迭代和响应式(Reactive)编程。为了吸引您阅读本文并查看该库，以下是基于他介绍的规范的 7kb 库中的一些示例:

响应式编程示例

从每秒滴答的时钟中选取前 5 个奇数，然后开始观察它们:

const {forEach, interval, map, filter, take, pipe} = require('callbag-basics');

pipe(
  interval(1000),
  map(x => x + 1),
  filter(x => x % 2),
  take(5),
  forEach(x => console.log(x))
);

// 1
// 3
// 5
// 7
// 9

可迭代编程示例

从一系列数字中，选择其中 5 个并将它们除以 4，然后开始逐个拉取:

const {forEach, fromIter, take, map, pipe} = require('callbag-basics');

function* range(from, to) {
  let i = from;
  while (i <= to) {
    yield i;
    i++;
  }
}

pipe(
  fromIter(range(40, 99)), // 40, 41, 42, 43, 44, 45, 46, ...
  take(5), // 40, 41, 42, 43, 44
  map(x => x / 4), // 10, 10.25, 10.5, 10.75, 11
  forEach(x => console.log(x))
);

// 10
// 10.25
// 10.5
// 10.75
// 11