如何从 typescript 中的联合接口访问密钥

Question

I added a package which has type definition like this:

interface DataA {
  keyA: string;
}
interface DataB {
  keyB: string;
}

type Data = DataA | DataB

And I'm trying to make a function which is:

type GetMyKey = (data: Data) => string
const getMyKey: GetMyKey = (data) => data.keyA || data.keyB

And this function makes Typescript Errors, which says that there's no keyA in DataB , and no keyB in DataA

Property 'keyA' does not exist on type 'Data'.
  Property 'keyA' does not exist on type 'DataB'.ts(2339)

Property 'keyB' does not exist on type 'Data'.
  Property 'keyB' does not exist on type 'DataA'.ts(2339)

I think I have to do type narrowing in my function but I don't have any clue how should I do.

Answer 1

I just found answer by myself.

By using in keyword

https://stackoverflow.com/a/50214853/6661359

const getMyKey: GetMyKey = (data) => {
  return ('keyA' in data) ? data.keyA : data.keyB
}

By using type predicates (aka. type guard)

https://www.typescriptlang.org/docs/handbook/2/narrowing.html#using-type-predicates

const isDataA = (data: Data): data is DataA => {
  return (data as DataA).keyA !== undefined
}

const getMyKey: GetMyKey = (data) => {
  return (isDataA(data)) ? data.keyA : data.keyB
}