箭头函数中的泛型 - TypeScript

TypeScript 支持在箭头函数中使用泛型，使得函数可以接受不同类型的参数，从而提高函数的灵活性。

基本语法

const functionName = <T>(args: T): T => {
  // 函数体
};

• <T>：表示使用泛型，可以是任意大写字母或单词作为标识符。
• args: T：表示参数类型为泛型 T，可以是任意类型。
• : T：表示返回值类型为泛型 T，可以是任意类型。

示例

const identity = <T>(val: T): T => {
  return val;
};

const str = identity<string>("hello world");
const num = identity<number>(3.14);

console.log(str); // 输出："hello world"
console.log(num); // 输出：3.14

在示例中，我们定义了一个 identity 函数，它接受任意类型的参数，并返回相同类型的值。通过使用泛型，可以告诉 TypeScript 在运行时期望函数处理的类型是什么。

泛型约束

有时候，我们需要确保函数的参数类型满足一定的条件。这时候，我们可以使用泛型约束。

interface Person {
  name: string;
  age: number;
}

const findByName = <T extends Person>(arr: T[], name: string): T | undefined => {
  return arr.find(person => person.name === name);
};

在示例中，我们定义了一个 Person 接口，它包含一个 name 属性和一个 age 属性。然后，我们定义了一个 findByName 函数，它接受一个 Person 数组和一个字符串类型的名称参数。我们使用 T extends Person 表示 T 必须满足 Person 接口的结构。最终，函数返回一个 Person 对象或者 undefined。

结论

现在，我们已经了解了如何在箭头函数中使用泛型。通常情况下，使用泛型可以提高函数的灵活性，同时可以提前处理数据类型错误。如果你要编写一个需要处理多种类型的 JavaScript 应用程序，那么 TypeScript 中的泛型支持将是你的强大工具之一。