如何为两个谓词指定相同参数类型约束？实现多参数泛型事件处理函数

1. 如何为两个谓词指定相同参数的类型约束？ #

要让两个谓词（predicate）共享相同的参数类型约束，最直接的方式是使用泛型来绑定参数类型，让TypeScript强制两个谓词的参数类型保持一致。

举个简单的例子，假设我们需要两个谓词都接收同一类型的参数，然后判断某个值是否同时满足这两个谓词：

// 定义泛型函数，用T统一约束两个谓词的参数类型和传入的值类型
function validateWithTwoPredicates<T>(
  predicate1: (arg: T) => boolean,
  predicate2: (arg: T) => boolean,
  value: T
): boolean {
  return predicate1(value) && predicate2(value);
}

// 使用示例：两个谓词都针对string类型
const isString = (x: unknown): x is string => typeof x === 'string';
const hasMinLength = (x: string): boolean => x.length >= 5;

// 类型正确，因为所有参数都匹配string类型
const isValid = validateWithTwoPredicates(isString, hasMinLength, "hello world");

// 如果尝试传入类型不匹配的谓词，TypeScript会报错
// validateWithTwoPredicates(isString, (x: number) => x > 10, "test"); // 类型错误

这里的泛型T相当于一个“类型变量”，它会自动推导传入的值的类型，然后强制两个谓词的参数必须和这个类型一致，从根源上避免了类型不匹配的问题。如果需要支持多参数的谓词，也可以扩展泛型为T1, T2或者用元组类型来约束。

2. 泛化支持多参数的自定义事件处理函数 #

你已经实现了单参数版本的myFunction，要扩展为支持任意数量参数的版本，关键是利用TypeScript的**Parameters<T>工具类型**来提取事件处理函数的参数类型，让谓词的参数和事件处理函数的参数完全对齐。

首先，我们先明确Event类型的定义，然后基于它实现泛化的函数：

// 你的自定义Event类型
type Event<T extends Function> = {
  addListener(listener: T): void;
  removeListener(listener: T): void;
};

// 泛化后的myFunction，支持任意参数数量的事件处理函数
export function myFunction<T extends (...args: any[]) => void>(
  event: Event<T>,
  predicate: (...args: Parameters<T>) => boolean
): Promise<void> {
  // 示例实现：添加监听器，当predicate返回true时完成Promise并移除监听器
  return new Promise((resolve) => {
    // 类型断言确保listener符合T的类型
    const listener: T = ((...args: Parameters<T>) => {
      if (predicate(...args)) {
        event.removeListener(listener);
        resolve();
      }
    }) as T;
    
    event.addListener(listener);
  });
}

// 使用示例：双参数的事件
type MyEvent = Event<(a1: string, a2: number) => void>;
const myEvent: MyEvent = {
  addListener: () => console.log("添加监听器"),
  removeListener: () => console.log("移除监听器")
};

// 谓词的参数自动匹配事件处理函数的string和number类型
myFunction(myEvent, (a1, a2) => a1 === "trigger" && a2 > 50)
  .then(() => console.log("条件满足，Promise完成"));

关键说明： #

• 泛型T被约束为任意参数的函数类型（(...args: any[]) => void），这样它可以匹配单参数、双参数甚至更多参数的事件处理函数。
• Parameters<T>是TypeScript内置的工具类型，它会提取出T类型函数的参数元组。比如Parameters<(a1: string, a2: number) => void>会返回[string, number]，这样谓词的参数就和事件处理函数的参数完全一致了。
• 通过类型断言as T把匿名函数转换成T类型，确保能正确传入addListener方法。

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