TypeScript中数组对象的可空联合类型守卫为何未按预期生效？

这个问题其实戳中了TypeScript类型系统里一个容易被忽略的细节——数组元素的可变性让类型守卫无法跨语句维持生效状态，咱们拆开来聊：

函数参数为啥没问题？ #

当你把Field类型的值传入函数f时，参数field是一个局部变量。TypeScript可以确定，在你执行if (field.test)这个判断之后，没有其他代码能偷偷修改field的值（毕竟它是函数内部的局部变量，外部碰不到）。所以类型守卫能稳稳地把field.test的类型收窄为{more: number}，后续访问field.test.more自然不会报错。

数组元素为啥报错？ #

而fields[0]是数组的一个元素，数组属于引用类型，TypeScript没办法保证：在你执行if (fields[0].test)之后，没有其他代码（比如异步回调、其他函数调用）把fields[0].test改成null。举个极端点的例子，说不定在判断和赋值之间，有个别的逻辑把这个元素改了呢？

TypeScript为了保证类型安全，就不会假设数组元素的类型在判断后保持不变，所以即使你刚做了非空判断，它还是会提示你“object is possibly null”。

解决办法 #

给你几个实用的方案：

• 提取为局部变量：把数组元素先赋值给一个局部变量，TypeScript能确定这个变量不会被外部修改，类型守卫就生效了：

  const currentField = fields[0];
  if (currentField.test) {
    currentField.test.more = 55; // 完全没问题
  }
  

• 非空断言（谨慎使用）：如果你100%确定fields[0].test绝对不是null，可以用!非空断言跳过类型检查：

  if (fields[0].test) {
    fields[0].test!.more = 55;
  }
  

  注意：这个方法会绕过TypeScript的类型检查，如果实际运行时test是null，会直接抛出错误，所以只在你能绝对保证的场景用。
• 更严格的类型约束：如果你的业务场景里，数组中的Field元素的test永远不会是null，可以直接把类型改成：

  type Field = {test: {more: number}};
  let fields: Field[] = [{test: {more: 55}}];
  

  这样就完全不需要类型守卫了。

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