当前位置：首页 > news >正文

【朝夕教育】《鸿蒙原生应用开发从零基础到多实战》004-TypeScript 中的泛型

news 来源：原创 2025/9/7 2:48:29

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

文章目录

🚀前言
🚀一、TypeScript 中的泛型
- 🔎1.泛型基础概念
- 🔎2.泛型使用场景
- 🔎3.泛型变量与约束
- 🔎4.泛型函数定义方式
- 🔎5.泛型与集合
- 🔎6.泛型接口
- 🔎7.泛型类
- 🔎8.多类型参数
- 🔎9.关键注意事项

🚀前言

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

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

🚀一、TypeScript 中的泛型

🔎1.泛型基础概念

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

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

🔎2.泛型使用场景

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

// 非泛型：需为不同类型单独实现
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.泛型变量与约束

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

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

泛型约束（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.泛型函数定义方式

函数声明

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

函数表达式

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

箭头函数

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

🔎5.泛型与集合

数组泛型
明确数组元素类型：
```
let arr: Array<number> = [1, 2, 3];
```

动态生成数组

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

🔎6.泛型接口

泛型参数在接口方法中

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

泛型参数在接口名中

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.关键注意事项

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