TypeScript 类型收窄入门

联合类型允许一个值有几种可能类型。使用前先判断当前是哪一种，就可以在分支里安全地调用对应操作，这个过程叫类型收窄。

使用 typeof 判断原始类型

function formatValue(value: string | number) {
  if (typeof value === 'number') {
    return value.toFixed(2)
  }

  return value.trim()
}

在 if 分支里，TypeScript 知道 value 是数字；另一个分支里则知道它是字符串。

使用属性判断对象类型

当几个对象类型有不同属性时，可以通过 'key' in value 判断当前分支。对 API 数据仍要保留运行时校验，因为类型声明不会验证服务端实际返回的内容。

小结

先通过条件判断缩小类型，再访问对应属性，是处理表单输入、请求结果和可选值时很常见的写法。