• Observables 数组操作

    Observables 数组操作

    In addition to simply iterating over an asynchronous collection, we can perform other operations such as filter or map and many more as defined in the RxJS API. This is what bridges an Observable with the iterable pattern, and lets us conceptualize them as collections.

    Let’s expand our example and do something a little more with our stream:

    除了简单地遍历异步集合之外,我们还可以执行其他操作,例如过滤或映射,以及RxJS API中定义的更多操作。 这是一个Observable与可迭代模式的桥梁,让我们将它们概念化为集合。

    让我们扩展我们的示例,并使用我们的流做一些事情:

    1. export class MyApp {
    2. private doctors = [];
    3. constructor(http: Http) {
    4. http.get('http://jsonplaceholder.typicode.com/users/')
    5. .flatMap((response) => response.json())
    6. .filter((person) => person.id > 5)
    7. .map((person) => "Dr. " + person.name)
    8. .subscribe((data) => {
    9. this.doctors.push(data);
    10. });
    11. }
    12. }

    View Example

    这里有两个真正有用的数组操作 - mapfilter。 这些做什么呢?

    • map将创建一个新的数组,其结果是在该数组中的每个元素上调用一个提供的函数。 在这个例子中,我们使用它来创建一个新的结果集,通过迭代每个项目,并追加“Dr.” 缩写在每个用户的名字前面。 现在我们数组中的每个对象都有“Dr.” 前面加上其name属性的值。
    • filter 将创建一个新数组,其中所有元素都通过由提供的函数实现的测试。 在这里,我们使用它来创建一个新的结果集,排除任何id属性小于6的用户。

    现在,当我们的subscribe回调被调用时,它接收的数据将是一个JSON对象的列表,其id属性大于或等于6,其名称属性已添加到“Dr .”.

    请注意链接函数样式,以及TypeScript附带的可选静态类型,我们在本示例中使用。 最重要的是函数比如filter返回一个Observable,就像Observable中的其他Observable,类似promise 。为了在链接序列中使用mapfilter ,我们使用flatMap展平了我们的Observable的结果。 由于filter接受一个Observable而不是一个数组,我们必须将我们的JSON对象数组从data.json()转换为Observable流。 这是通过flatMap完成的。

    你可以在Observable`中使用很多其他的数组操作; 在 RxJS API中查找它们。

    rxmarbles.com 是一个有用的资源,有助于你了解operations的工作原理。