6.2 泛型函数 - 全栈应用开发修炼手册课程

🎯 学习目标

掌握泛型函数的各种写法
理解类型推断和显式指定
学会使用泛型约束
了解泛型函数的最佳实践

📝 泛型函数类型

// 泛型函数类型定义
type GenericIdentityFn<T> = (arg: T) => T;

function identity<T>(arg: T): T {
  return arg;
}

let myIdentity: GenericIdentityFn<number> = identity;

// 对象属性中的泛型函数
interface GenericFunctions {
  identity: <T>(arg: T) => T;
  first: <T>(arr: T[]) => T | undefined;
}

// 类型别名中的泛型
type Mapper<T, U> = (item: T) => U;

function map<T, U>(arr: T[], mapper: Mapper<T, U>): U[] {
  return arr.map(mapper);
}
      

🔧 泛型约束

// 约束 T 必须有 length 属性
interface Lengthwise {
  length: number;
}

function logLength<T extends Lengthwise>(arg: T): T {
  console.log(arg.length);
  return arg;
}

logLength('hello');      // 5
logLength([1, 2, 3]);    // 3
logLength({ length: 10 });  // 10
// logLength(123);       // Error: number 没有 length 属性

// 使用 keyof 约束
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

const user = { name: 'Alice', age: 30 };
getProperty(user, 'name');  // OK: string
getProperty(user, 'age');   // OK: number
// getProperty(user, 'email');  // Error: 不存在的属性
      

📝 本节小结

✅

• 使用 type 或 interface 定义泛型函数类型
• extends 约束泛型类型范围
• keyof 用于约束属性名类型
• 多类型参数用逗号分隔