TypeScript interface中如何简化多个结构相同的可选setter属性定义

算力阿峰

2026-9-29

实现方案

TypeScript 4.1及以上版本支持模板字面量类型搭配映射类型，可以完美实现你需要的批量定义效果，无需逐个声明setter，有两种常用实现方式：

方案1：严格限定setter范围（类型更安全）

先定义所有需要支持的原料名联合类型，后续新增setter只需修改该联合即可：

// 自定义所有需要支持的原料名，首字母大写匹配setXxx的命名规则
type Ingredient = 'Milk' | 'Water' | 'Sugar' | 'Coffee' | 'Honey'
// 批量生成符合规则的可选setter类型
type IngredientSetters = {
  [K in Ingredient as `set${K}`]?: (volume: number) => void
}
// 合并基础字段与setter得到最终接口
export interface IProduct extends IngredientSetters {
  customization: Customization;
  preparation: Preparation;
  make: () => void;
}

该方案下只有你在`Ingredient`中定义过的后缀会被识别为合法setter，写错方法名时TypeScript会直接抛出类型错误，适合明确知道所有需要支持的setter范围的场景。

方案2：通配所有set开头的方法（灵活度更高）

如果不需要限制setter的具体后缀，只要方法名以set开头就符合规则，可以直接用模板字面量索引签名实现（需TypeScript 4.4及以上版本支持）：

export interface IProduct {
  customization: Customization;
  preparation: Preparation;
  make: () => void;
  // 所有以set开头的属性，均为接收number参数的可选方法
  [key: `set${string}`]?: (volume: number) => void;
}