【愚公系列】《鸿蒙原生应用开发从零基础到多实战》004-TypeScript 中的泛型

标题	详情
作者简介	愚公搬代码
头衔	华为云特约编辑，华为云云享专家，华为开发者专家，华为产品云测专家，CSDN博客专家，CSDN商业化专家，阿里云专家博主，阿里云签约作者，腾讯云优秀博主，腾讯云内容共创官，掘金优秀博主，亚马逊技领云博主，51CTO博客专家等。
近期荣誉	2022年度博客之星TOP2，2023年度博客之星TOP2，2022年华为云十佳博主，2023年华为云十佳博主，2024年华为云十佳博主等。
博客内容	.NET、Java、Python、Go、Node、前端、IOS、Android、鸿蒙、Linux、物联网、网络安全、大数据、人工智能、U3D游戏、小程序等相关领域知识。
欢迎	👍点赞、✍评论、⭐收藏

---

🚀前言

在现代开发中，泛型是一种重要的编程概念，能够极大地提升代码的灵活性和可重用性。TypeScript作为一种强大的编程语言，提供了对泛型的良好支持，让开发者能够以更安全和高效的方式处理各种数据类型。在鸿蒙原生应用开发中，掌握TypeScript中的泛型，不仅能优化代码结构，还能提升应用的性能和可维护性。

在本篇文章中，我们将详细介绍TypeScript中的泛型，包括泛型函数、泛型接口和泛型类等核心概念。通过丰富的实例，我们将展示如何在鸿蒙原生应用中灵活运用泛型，帮助你实现更高效的开发流程，减少代码冗余，提升项目的可读性和可扩展性。

🚀一、TypeScript 中的泛型

🔎1.泛型基础概念

定义：泛型（Generics）允许在定义函数、接口或类时不预先指定具体类型，而是在使用时动态指定类型，提升代码复用性和类型安全。

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

🔎2.泛型使用场景

1. 兼容多类型需求
   避免为不同类型重复编写相同逻辑的函数：

   // 非泛型：需为不同类型单独实现
   function f(a: number): number[] { return [a]; }
   function f2(a: string): string[] { return [a]; }
   
   // 泛型：统一处理多种类型
   function f3<T>(a: T): T[] { return [a]; }
   f3<number>(1);  // 显式指定类型
   f3('hello');    // 类型推断自动推导为 string
   

🔎3.泛型变量与约束

1. 类型变量 T
   表示任意类型，但需确保对 T 的操作合法：

   function getLength<T>(arg: T): number {
       return arg.length; // 错误：T 可能没有 length 属性
   }
   

2. 泛型约束（extends）
   限制 T 必须满足特定结构：

   interface HasLength {
       length: number;
   }
   function getLengthSafe<T extends HasLength>(arg: T): number {
       return arg.length; // 正确：T 必须包含 length 属性
   }
   getLengthSafe('abc'); // 3
   getLengthSafe(123);   // 错误：number 无 length
   

🔎4.泛型函数定义方式

1. 函数声明

   function myFunc<T>(x: T): T { return x; }
   

2. 函数表达式

   const myFunc = function<T>(x: T): T { return x; };
   

3. 箭头函数

   const myFunc = <T>(x: T): T => x;
   // 注意：在 JSX 中需写成 <T, > 避免语法冲突
   

🔎5.泛型与集合

1. 数组泛型
   明确数组元素类型：

   let arr: Array<number> = [1, 2, 3];
   

2. 动态生成数组

   function createArray<T>(len: number, value: T): T[] {
       return Array(len).fill(value);
   }
   createArray<string>(3, 'x'); // ['x', 'x', 'x']
   

🔎6.泛型接口

1. 泛型参数在接口方法中

   interface GenericInterface {
       <T>(arg: T): T;
   }
   const func: GenericInterface = (arg) => arg;
   

2. 泛型参数在接口名中

   interface GenericInterface<T> {
       (arg: T): T;
   }
   const func: GenericInterface<string> = (arg) => arg;
   

🔎7.泛型类

在类定义时声明泛型，供实例属性和方法使用：

class GenericClass<T> {
    value: T;
    constructor(val: T) {
        this.value = val;
    }
    getValue(): T {
        return this.value;
    }
}
const numInstance = new GenericClass<number>(10);

🔎8.多类型参数

支持同时定义多个泛型类型：

function swap<T, U>(tuple: [T, U]): [U, T] {
    return [tuple[1], tuple[0]];
}
swap<number, string>([1, 'one']); // ['one', 1]

🔎9.关键注意事项

1. 避免滥用 any
   泛型在保留类型信息的同时提供灵活性，优于 any。
2. 类型推断优先级
   多数情况下无需显式指定类型参数，编译器可自动推断。
3. 约束与灵活性平衡
   通过 extends 确保类型安全，但过度约束可能限制泛型适用性。