javascript - RxJS-收集异步操作结果

原文 标签 javascript typescript reactive-programming rxjs observable

我想对数组的每个元素执行异步操作,并将其结果收集在字典中。我当前的方法是:



let asyncOp = () => Rx.Observable.interval(300).take(1);
let dict = {};

Rx.Observable.from(['a', 'b'])
  .mergeMap(el => asyncOp()
              .map(asyncOpRes => dict[el] = asyncOpRes)
              .do(state => console.log('dict state: ', dict))
  )
  .takeLast(2)
  .take(1)
  .map(() => dict)
  .subscribe(res => console.log('dict result: ', res));

<script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-beta.7/dist/global/Rx.umd.js"></script>





基本上,这就像我想要的那样工作,但是RxJs运算符的用法似乎很尴尬。因此,我需要以下方面的帮助:


避免dict突变(使用scan()尝试过,但在这里不知道如何使用它。有一个mergeScan()方法,但此处相同)
takeLast和take的用法-应该可以简化吗?


我想我缺少一个RxJS运算符,它可以帮助我简化此操作。

最佳答案

要“对数组的每个元素执行异步操作并将其结果收集到字典中”,可以使用mergeMapreduce函数显着简化代码:

import * as Rx from "rxjs/Rx";

const asyncOp = () => Rx.Observable.interval(300).take(1);

Rx.Observable.from(["a", "b"])

    // Perform the async operation on the values emitted from the
    // observable and map the emitted value and async result into
    // an object.

    .mergeMap((key) => asyncOp().map((result) => ({ key, result })))

    // Use reduce to build an object containing the emitted values
    // (the keys) and the async results.

    .reduce((acc, value) => { acc[value.key] = value.result; return acc; }, {})
    .subscribe((value) => { console.log(value); });

关于javascript - RxJS-收集异步操作结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39353780/

相关文章:

javascript:在for循环中对 'freeze' i的值使用闭包

ios - react cocoa : Chain a signal with a repeating signal

c# - RX-Zip输出意外结果

javascript - typescript :是否可以只为导出类型的一个键设置状态?

javascript - 如何在Angular的表单字段中设置“选择输入”?

javascript - (Angular) 在 Bootstrap 模式中访问 Typescript 对象

Spring 5 Web Reactive Programming - 从流数据的 Spring Reactive Controller 解码 JSON 时出现 WebClient ClassCastException

javascript - 如何在 d3.js 元素上使用 intro.js

javascript - 父作用域中的访问变量

javascript - 如何基于设备加载样式表和javascript和jquery