javascript - rxjs Observable 相对于 DOM 事件有什么优点？

Question

我一直在研究 rxjs 和响应式编程，但有些东西我还不太明白。例如，我想获取简单输入上的 keyup 事件的结果，映射它，并将映射结果设置为另一个 div 内容:

const root = $('#root'),
      input = root.find('#some-input'),
      result = root.find('#result');

使用 rxjs，我可以做到:

const keyupObs = fromEvent(input, 'keyup');
const mapper = keyupObs.pipe(
    map(e => $(e.target)),
    tap(t => result.html(t.val()))
).subscribe(t => console.log(t));

使用jquery驱动的事件，我可以写:

input.on('keyup', e => result.html($(e.currentTarget).val()));

代码更少，对于像我这样的初学者来说似乎与我使用 rxjs 编写的代码没有太大区别。那么使用 rxjs 的主要优点是什么？为什么我应该使用它而不是 DOM 驱动事件(在本例中使用 jQuery)？

Answer 1

采用可观察的定义:

Observables are lazy Push collections of multiple values.

这本身并没有多大意义。在您的情况下，事件机制适合您的需求并模拟流。

如果你想怎么办:

1. 将值与另一个流合并？
2. 以复杂的方式映射和修改输出？
3. 是否有 Promise 不支持的异步流？
4. 缓存第一个值之后的输出？
5. 跨组件和服务使用它？

事件可观察对象本身提供的值(value)最少，但如果您想使用并与其他对象结合，可观察对象将提供大量可供使用的运算符。