题库/TypeScript/题目详解
通用前端约 2 分钟阅读

联合类型和类型收窄解决什么问题

先理解原理和示例，再练习完整口述与追问。

回答要点

用带 status / type 字段的可辨识联合表达加载、成功、失败等状态，通过 typeof、in 或类型守卫收窄。少用断言强行绕过检查；as 不会在运行时验证接口数据。TypeScript 官方类型收窄文档

原理拆解

联合类型说明一个值可能属于多个结构，收窄通过运行时分支证明当前是哪一种。判别联合给各分支共同字段不同字面量值，编译器可以据此排除其他分支。穷尽检查把漏掉的新分支转成编译错误，适合请求状态和业务状态机。

示例与推演

ts
type Result = { status: 'ok'; data: string } | { status: 'error'; message: string }
function show(result: Result) {
  if (result.status === 'ok') return result.data
  return result.message
}

不需要先 as 成功类型再读取 data，状态判断已经给出证明。

易错点

真值判断可能排除合法的 0 和空字符串。自定义 is 类型守卫的实现必须真的验证条件，否则编译通过也会运行失败。

参考回答可直接练习口述

联合类型表达一个值可能有多个合法形态，可辨识联合再用固定 status/type 字段把形态区分开。例如 idle、loading、success 带 data、error 带 message，判断 status 后 TS 就能知道哪些字段可用。typeof、in 和类型守卫也可收窄。as 只是告诉编译器按某种类型看，不检查网络数据；关键边界需要真正运行的验证代码。