TypeScript中能否通过函数入参决定对应的返回值类型？

完全可以通过TypeScript原生支持的函数重载能力实现需求，无需复杂类型体操，类型匹配精准度完全符合调用场景要求。 #

具体实现步骤 #

1. 先定义两类返回结果对应的类型结构

// 未传id时返回的集合数据结构
interface A {
  list: Array<{ id: number; name: string }>;
  total: number;
  page: number;
  pageSize: number;
}

// 传入id时返回的单条实体结构
interface B {
  id: number;
  name: string;
  description: string;
  createTime: string;
  updateTime: string;
}

2. 声明函数重载签名（仅做类型约束，不包含业务逻辑）

// 无参调用返回集合类型A
function fn(): A;
// 传入number类型id时返回单条类型B
function fn(id: number): B;

3. 编写兼容所有重载场景的函数实现

// 实现签名的入参、返回值要兼容所有重载声明
function fn(id?: number): A | B {
  // 未传入id走集合查询逻辑
  if (typeof id === 'undefined') {
    return {
      list: [],
      total: 0,
      page: 1,
      pageSize: 10
    }
  }
  // 传入id走单条查询逻辑
  return {
    id,
    name: '',
    description: '',
    createTime: '',
    updateTime: ''
  }
}

效果验证 #

编写调用代码时，TS会自动根据入参推导对应返回类型，错误访问不存在的属性会直接抛出类型错误：

// 推导类型为A，可正常访问list、total等A独有属性
const myCollectionData = fn();
// 推导类型为B，可正常访问description、createTime等B独有属性
const mySingleRecordData = fn(1);

如果项目中习惯使用箭头函数，可以通过调用签名的方式实现等价的重载效果：

interface FnOverload {
  (): A;
  (id: number): B;
}

const fn: FnOverload = (id?: number) => {
  if (typeof id === 'undefined') {
    // 内部实现可根据场景加类型断言，避免TS类型推导报错
    return { list: [], total: 0, page: 1, pageSize: 10 } as A
  }
  return { id, name: '', description: '', createTime: '', updateTime: '' } as B
}

注意：函数实现的签名不会对外暴露，外部调用时只会匹配你声明的重载签名，不会出现返回联合类型导致的属性访问报错问题。

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