如何将动态长度的Observable数组传入Observable.zip并编写取值函数？

这个问题我之前也碰到过！当Observable数组长度不固定时，硬编码投影函数的参数肯定行不通，这里有几个实用的解决思路：

首先，Observable.zip的投影函数（第二个参数）支持用剩余参数语法来捕获所有动态传入的Observable结果，这样不管数组长度怎么变，都能灵活处理。

1. 直接返回结果数组（最简单的情况） #

如果不需要把结果转成对象，直接让zip返回包含所有值的数组就行，甚至可以省略投影函数：

import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/zip";

obsArray: Observable<any>[]; // 动态数组

functionName(): Observable<any[]> {
  // 直接扩展数组，zip默认会返回对应顺序的结果数组
  return Observable.zip(...obsArray);
}

订阅这个Observable时，你会得到一个数组，里面的元素和obsArray中Observable的顺序完全对应。

2. 动态生成结果对象 #

如果需要把结果转成类似你示例中的键值对对象，可以结合剩余参数和数组遍历/归约来构建：

情况A：有预设的键名数组 #

如果你有和obsArray长度匹配的键名数组（比如['userInfo', 'productData', 'orderList']），可以这样写：

import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/zip";

obsArray: Observable<any>[];
resultKeys: string[]; // 比如 ['arg1', 'arg2', 'arg3']，和obsArray长度一致

functionName(): Observable<Record<string, any>> {
  return Observable.zip(...obsArray, (...values) => {
    // 用reduce把值和键名对应起来
    return values.reduce((result, value, index) => {
      result[this.resultKeys[index]] = value;
      return result;
    }, {} as Record<string, any>);
  });
}

情况B：自动生成类似arg1/arg2的键名 #

如果不需要自定义键名，只想按顺序生成arg1、arg2这样的键，可以用forEach遍历构建对象：

import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/zip";

obsArray: Observable<any>[];

functionName(): Observable<Record<string, any>> {
  return Observable.zip(...obsArray, (...values) => {
    const result: Record<string, any> = {};
    values.forEach((value, index) => {
      result[`arg${index + 1}`] = value;
    });
    return result;
  });
}

注意事项 #

• Observable.zip是在订阅时确定参与组合的Observable集合的，如果obsArray在订阅之后才修改（比如添加/删除元素），这些变化不会反映到zip的组合逻辑里。如果需要支持订阅后动态调整Observable集合，可能需要结合Subject和switchMap来重新创建zip流。
• 确保obsArray里的每个Observable最终都会发出值，否则zip会一直等待，不会触发投影函数。

内容的提问来源于stack exchange，提问作者Bum