为什么 typescript typeguard 对对象的内部属性不起作用

如何解决为什么 typescript typeguard 对对象的内部属性不起作用

使用打字稿，当函数返回具有可能为 null 的属性的对象时。为什么在这些内部属性上使用 typeguard 不允许 typescript 推断内部 prop 在保护之后不能为 null？

这是一个最小的例子。 Try it

interface DatabaseResponse {
  settings: string | null
}
interface MainResponse {
  settings: string
}

const retrieveFromDatabase = (): DatabaseResponse => {
  return {
    settings: 'always a string but lets pretend it Could be null sometimes'
  }
}

const main = (): MainResponse | Error => {
  const data = retrieveFromDatabase()

  if (data.settings === null) {
    throw new Error()
  }

  return data

}

main函数返回的错误是

Type 'DatabaseResponse' is not assignable to type 'MainResponse | Error'.
  Type 'DatabaseResponse' is not assignable to type 'MainResponse'.
    Types of property 'settings' are incompatible.
      Type 'string | null' is not assignable to type 'string'.
        Type 'null' is not assignable to type 'string'.

解决方法

那不是真正的类型保护。你可以这样做：

interface DatabaseResponse {
    settings: string | null
}
interface MainResponse {
    settings: string
}

const retrieveFromDatabase = (): DatabaseResponse => {
    return {
        settings: 'always a string but lets pretend it could be null sometimes'
    } as DatabaseResponse
}

const main = (): MainResponse | Error => {
    const data = retrieveFromDatabase()

    if (!isMainResponse(data)) {
        throw new Error()
    }

    return data
}

const isMainResponse = (data: DatabaseResponse | MainResponse): data is MainResponse {
  return !!data.settings;
}

或者类似地，创建一个具有相同 typeguard 的新的 nonNullable 类型

type NonNullableDB = { [K in keyof DatabaseResponse]: NonNullable<DatabaseResponse[K]> }

const isMainResponse = (data: DatabaseResponse | MainResponse): data is NonNullableDB => {
    return !!data.settings;
}