TypeScript联合类型报错：获取API错误message的解决方案

针对你的场景，有几种简单方案可以实现「当message存在时取其值，不存在时设为null」的需求：

方案1：使用in操作符做类型守卫（最安全） #

利用TypeScript的类型收缩特性，通过in判断属性是否存在，自动推导分支类型：

const submissionDetails = await getSubmission(appTypeId, submissionId);
const errorMessage = 'message' in submissionDetails ? submissionDetails.message : null;

这种方式完全符合类型安全要求，TypeScript能准确识别两种分支的类型。

方案2：可选链 + 空值合并（最简洁） #

通过临时类型断言配合可选链操作符，快速取值并处理属性不存在的情况：

const submissionDetails = await getSubmission(appTypeId, submissionId);
const errorMessage = (submissionDetails as { message?: string }).message ?? null;

如果不介意临时类型断言，这种写法最简短，适合快速实现需求。

方案3：自定义类型谓词（适合复用场景） #

如果需要在多个地方判断这种联合类型，可以封装一个类型谓词函数：

function isErrorResponse(res: SubmissionDetails | { message: string }): res is { message: string } {
  return 'message' in res;
}

// 使用示例
const submissionDetails = await getSubmission(appTypeId, submissionId);
const errorMessage = isErrorResponse(submissionDetails) ? submissionDetails.message : null;

这种方式代码可读性更强，适合重复使用类型判断逻辑的场景。

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