如何复用TypeScript函数返回的带复杂泛型的类型？

你使用的第三方库parseAbiItem函数签名如下：

export function parseAbiItem<
  TSignature extends string | readonly string[] | readonly unknown[],
>(....
): ParseAbiItem<TSignature> {
  ...
  return abiItem as ParseAbiItem<TSignature>
}

你希望在自定义Event类型中复用该函数的返回类型，避免复制类型定义，现有代码如下：

import { parseAbiItem } from "...";

type Event = {
   ...
   parsedItem: [what do i put here?];
}

const event: Event = {
   ...
   parsedItem: parseAbiItem(...)
}

以下是符合DRY原则的几种实现方式：

方式一：直接使用库导出的ParseAbiItem泛型（如果库已导出） #

如果第三方库将ParseAbiItem类型对外导出，你可以直接在自定义类型中使用这个泛型，传入你的ABI签名类型：

import { parseAbiItem, ParseAbiItem } from "...";

// 定义你的ABI签名类型
type MyEventSignature = "event Transfer(address indexed from, address indexed to, uint256 value)";

type Event = {
  // 其他属性
  parsedItem: ParseAbiItem<MyEventSignature>;
};

const event: Event = {
  // 其他属性
  parsedItem: parseAbiItem<MyEventSignature>("event Transfer(address indexed from, address indexed to, uint256 value)")
};

方式二：用ReturnType推导返回类型（如果ParseAbiItem未导出） #

如果库没有导出ParseAbiItem，可以通过ReturnType工具类型结合typeof parseAbiItem来提取指定泛型参数下的返回类型：

import { parseAbiItem } from "...";

type MyEventSignature = "event Transfer(address indexed from, address indexed to, uint256 value)";

// 提取parseAbiItem在指定泛型下的返回类型
type ParsedEventItem = ReturnType<typeof parseAbiItem<MyEventSignature>>;

type Event = {
  // 其他属性
  parsedItem: ParsedEventItem;
};

const event: Event = {
  // 其他属性
  parsedItem: parseAbiItem("event Transfer(address indexed from, address indexed to, uint256 value)")
};

方式三：通过具体值推导类型（更灵活） #

如果不需要提前定义签名类型，可以先创建parsedItem的具体值，再用typeof提取它的类型：

import { parseAbiItem } from "...";

// 先初始化parsedItem实例
const parsedEventItem = parseAbiItem("event Transfer(address indexed from, address indexed to, uint256 value)");

// 从具体值推导类型
type Event = {
  // 其他属性
  parsedItem: typeof parsedEventItem;
};

const event: Event = {
  // 其他属性
  parsedItem: parsedEventItem
};

以上三种方式都无需复制第三方库的类型定义，直接复用库提供的类型系统或通过TypeScript自身的类型推导能力实现，完全符合DRY原则。

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