如何在TypeScript中强制所有剩余参数为可选参数？

要实现定义接收回调的函数/类时，强制回调除第一个参数外的剩余参数全为可选（传入带必填剩余参数的回调时触发类型错误，同时支持调用时仅传首个参数或附带剩余参数），可以通过TypeScript的条件类型和元组操作实现：

工具类型定义 #

首先定义一个工具类型，用来约束回调的参数结构：

// 约束回调：第一个参数必填，剩余所有参数必须为可选
type CallbackWithOptionalRest<T extends (...args: any[]) => any> = 
  T extends (first: infer First, ...rest: infer Rest) => infer Return
    ? Rest extends [...{ [K in keyof Rest]?: Rest[K] }]
      ? T
      : never
    : never;

这个类型会检查：

• 回调至少有一个必填的第一个参数
• 剩余的参数元组Rest必须完全匹配“所有元素都是可选的”元组（通过映射类型给每个元素加上?修饰符）

应用示例 #

接收回调的函数 #

function useCallback<T extends (...args: any[]) => any>(
  cb: CallbackWithOptionalRest<T>
) {
  // 调用场景1：仅传第一个必填参数
  cb("requiredArg");
  // 调用场景2：传入第一个参数+部分/全部可选参数
  cb("requiredArg", "optional1", 2);
}

// ✅ 合法：剩余参数均为可选
useCallback((first: string, second?: string, third?: number) => {
  console.log(first, second, third);
});

// ❌ 类型错误：第二个参数为必填，不符合约束
useCallback((first: string, second: string) => {
  console.log(first, second);
});

类中的应用 #

class EventEmitter {
  on<T extends (...args: any[]) => any>(
    event: string,
    handler: CallbackWithOptionalRest<T>
  ) {
    // 模拟触发事件：仅传第一个参数
    handler("eventData");
    // 模拟触发事件：带可选参数
    handler("eventData", true);
  }
}

const emitter = new EventEmitter();

// ✅ 合法
emitter.on("click", (data: string, isDoubleClick?: boolean) => {
  console.log(data, isDoubleClick);
});

// ❌ 类型错误：第二个参数必填
emitter.on("click", (data: string, isDoubleClick: boolean) => {
  console.log(data, isDoubleClick);
});

关键逻辑说明 #

• 当回调的剩余参数存在必填项时，Rest extends [...{ [K in keyof Rest]?: Rest[K] }]条件不成立，工具类型返回never，导致参数类型不匹配，触发TypeScript错误。
• 调用回调时，既可以只传入第一个必填参数，也可以传入任意数量的剩余可选参数，完全符合预期的调用灵活性。

你可以将上述代码复制到TypeScript Playground中进行测试验证。

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