TypeScript如何过滤Promise数组的undefined值并保持返回Promise<string[]>

错误原因 #

你在map后直接调用filter时，map返回的是Promise<string | undefined>[]数组，你过滤的是Promise实例本身而非异步执行后的返回值，这个过滤逻辑完全不生效，Promise.all返回的仍然是(string | undefined)[]类型，所以触发类型错误。

正确实现 #

你需要先等待所有异步任务执行完成，拿到所有返回结果后再过滤undefined值，同时通过类型谓词告知TypeScript过滤后的结果类型：

const someFunction = async (someParam: string): Promise<string | undefined> => {
  // 原有逻辑
}

const myFunction = async (params: string[]): Promise<string[]> => {
  // 先等待所有异步任务执行完成，拿到全量结果
  const allResults = await Promise.all(
    params.map(param => someFunction(param))
  );
  // 过滤undefined，通过类型谓词让TS识别最终数组类型为string[]
  return allResults.filter((value): value is string => value !== undefined);
};

filter回调里的value is string是TypeScript的类型守卫语法，会在运行时过滤undefined的同时，让TypeScript将过滤后的数组类型自动推导为string[]，完全符合你要求的返回类型，不需要修改返回值定义。

如果你确定不需要保留空字符串等 falsy 值，也可以用更简短的类型断言写法（安全性略低于类型守卫方案）：

const myFunction = async (params: string[]): Promise<string[]> => {
  const allResults = await Promise.all(params.map(someFunction));
  return allResults.filter(Boolean) as string[];
};

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