TypeScript中如何给普通声明式函数应用指定的函数接口？

TypeScript 目前没有原生支持直接在普通函数声明的语法上绑定整体函数类型接口，你尝试的将接口写在函数泛型参数位的写法是错误的，该位置仅用于声明当前函数自身的泛型参数，不可用来指定函数整体类型。

以下是两个可行的实现方案，都可以保留普通函数声明的写法，无需将函数赋值给变量：

方案1：使用 satisfies 运算符做后置校验（推荐，需 TS 4.9+） #

TS 4.9 新增的 satisfies 运算符可以在不改变值本身类型的前提下，校验值是否符合指定类型，你只需要在写完普通函数声明后新增一行校验逻辑即可：

interface ResourceGetter<TInput, TOutput> {
  (id: TInput): TOutput;
}

interface User {
  id: number;
  name: string;
}

// 保留普通函数声明写法
function getUser(id: number): User {
  return { id, name: 'Some random person' };
}

// 新增校验逻辑，签名不匹配会直接抛出TS错误
getUser satisfies ResourceGetter<number, User>;

方案2：兼容低版本TS的校验写法 #

如果你的项目使用的TS版本低于4.9，可以通过临时变量赋值的方式做类型校验，该变量不需要实际使用，仅用于类型检查：

function getUser(id: number): User {
  return { id, name: 'Some random person' };
}

// 临时变量做类型校验，签名不匹配会抛出错误
const _unusedCheck: ResourceGetter<number, User> = getUser;

可选：自动同步接口的参数/返回值类型 #

如果你不想手动编写函数的参数、返回值类型注解，可以通过TS内置工具类型从接口中自动提取，后续接口修改时函数类型会自动同步：

// 提取接口参数类型
type GetterInput = Parameters<ResourceGetter<number, User>>[0];
// 提取接口返回值类型
type GetterOutput = ReturnType<ResourceGetter<number, User>>;

function getUser(id: GetterInput): GetterOutput {
  return { id, name: 'Some random person' };
}

// 保留校验逻辑
getUser satisfies ResourceGetter<number, User>;

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