typescript - 查找表的正确键入

Question

我正在尝试使用函数键入查找表的返回值。
虽然它适用于简单的查找表:

const lookupTable = {
  A: "foo",
  B: 1,
};

function findInTable<T extends "A" | "B">(p: T): typeof lookupTable[T] {
  return lookupTable[p];
}

const isString: string = findInTable("A");
const isNumber: number = findInTable("B");

我似乎无法使其与函数的返回类型一起使用

const lookupTable = {
  A: () => "foo",
  B: () => 1,
};

function findInTable<T extends "A" | "B">(
  p: T
): ReturnType<typeof lookupTable[T]> {
  return lookupTable[p](); // Can't assign string | number to ReturnType<{ A: () => string; B: () => number; }[T]>
}

const isString: string = findInTable("A");
const isNumber: number = findInTable("B");

我该如何编写它以使其构建？

Answer 1

你应该重载你的函数:

const lookupTable = {
  A: () => "foo",
  B: () => 1,
} as const;

function findInTable<T extends keyof typeof lookupTable>(
  p: T
):ReturnType<typeof lookupTable[T]>
function findInTable<T extends keyof typeof lookupTable>(
  p: T
) {
  return lookupTable[p]();
}

const isString = findInTable("A"); // string
const isNumber = findInTable("B"); // number

Playground
尽量避免像这里这样声明显式类型 const isString: string大多数时候 TS 应该为您完成这项工作。
AFAIK，函数重载是二元的。这意味着他们没有那么严格。
TS 不检查具有重载实现的函数内部实现。
因为 T extends "A" | "B" ，此代码有效:

const lookupTable = {
  A: () => "foo",
  B: () => 1,
};

function findInTable<T extends "A" | "B">(
  p: T
): ReturnType<typeof lookupTable[T]> {
  return lookupTable[p](); // Can't assign string | number to ReturnType<{ A: () => string; B: () => number; }[T]>
}

const isString = findInTable<'B' | 'A'>("A");
const isNumber = findInTable<'B' | 'A'>("B");

这就是为什么 TS 无法弄清楚将返回什么函数的原因。在任何时刻它都可以是 A 或 B
如果您想 super 安全，请考虑以下示例:

const lookupTable = {
  A: () => "foo",
  B: () => 1,
} as const;

// credits goes to https://stackoverflow.com/a/50375286
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
  k: infer I
) => void
  ? I
  : never;

// credits https://stackoverflow.com/users/125734/titian-cernicova-dragomir
type IsUnion<T> = [T] extends [UnionToIntersection<T>] ? false : true;

function findInTable<T extends keyof typeof lookupTable>(
  p: IsUnion<T> extends true ? never : T
): ReturnType<typeof lookupTable[T]>
function findInTable<T extends keyof typeof lookupTable>(
  p: T
) {
  return lookupTable[p]();
}

const isString = findInTable<'A' | 'B'>("A"); // error

您可能已经注意到，您不能使用 findInTable<'A' | 'B'>("A")显式联合泛型。