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

news/2025/3/1 14:57:35/
标题详情
作者简介愚公搬代码
头衔华为云特约编辑,华为云云享专家,华为开发者专家,华为产品云测专家,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)允许在定义函数、接口或类时不预先指定具体类型,而是在使用时动态指定类型,提升代码复用性和类型安全。

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

🔎2.泛型使用场景

  1. 兼容多类型需求
    避免为不同类型重复编写相同逻辑的函数:
    typescript">// 非泛型:需为不同类型单独实现
    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 的操作合法:

    typescript">function getLength<T>(arg: T): number {return arg.length; // 错误:T 可能没有 length 属性
    }
    
  2. 泛型约束(extends
    限制 T 必须满足特定结构:

    typescript">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. 函数声明

    typescript">function myFunc<T>(x: T): T { return x; }
    
  2. 函数表达式

    typescript">const myFunc = function<T>(x: T): T { return x; };
    
  3. 箭头函数

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

🔎5.泛型与集合

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

    typescript">let arr: Array<number> = [1, 2, 3];
    
  2. 动态生成数组

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

🔎6.泛型接口

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

    typescript">interface GenericInterface {<T>(arg: T): T;
    }
    const func: GenericInterface = (arg) => arg;
    
  2. 泛型参数在接口名中

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

🔎7.泛型类

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

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

🔎8.多类型参数

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

typescript">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 确保类型安全,但过度约束可能限制泛型适用性。

http://www.ppmy.cn/news/1575794.html

相关文章

Python毕业设计选题:基于Python的社区爱心养老管理系统设计与实现_django

开发语言&#xff1a;Python框架&#xff1a;djangoPython版本&#xff1a;python3.7.7数据库&#xff1a;mysql 5.7数据库工具&#xff1a;Navicat11开发软件&#xff1a;PyCharm 系统展示 管理员登录 管理员功能界面 用户管理 身体健康界面 公共书籍界面 借阅信息界面 归还…

xss-labs搭建及学习

搭建 搭建过程与一般的网站搭建差不多 参考资料 当出现这个界面就是成功了 学习 学习资料 xss概念理解&#xff1a;XSS跨站脚本攻击 xss常见标签&#xff1a;XSS常见触发标签 level1-直接打 这里提示payload长度为4查看一下源码 发现get传参name的值test插入了html里头&am…

harbor拉取全部镜像

本脚本通过harbor v2.0 API请求&#xff0c;采用三层for循环&#xff0c;分别是project、repository、tag三层来将拉取全部镜像到本地&#xff0c;tag的名称列表输出到imagelist文件中。并有两三个优化改编版本。 文章目录 拉取harbor仓库全部镜像拉取全部repository中最新的几…

AF3 DataPipeline类process_multiseq_fasta 方法解读

AlphaFold3 data_pipeline 模块DataPipeline类的 process_multiseq_fasta 方法用于处理多序列 FASTA 文件,生成 AlphaFold3 结构预测所需的特征,适用于多链复合物的预测。它结合了 Minkyung Baek 在 Twitter 上提出的“AlphaFold-Gap”策略,即通过在多链 MSA 中插入固定长度…

大模型的参数长什么样子,ds回答

嗯&#xff0c;用户问的是大模型的参数长什么样子&#xff0c;还要举个例子。那我得先理解大模型的参数到底是什么样的结构。根据之前提供的搜索结果&#xff0c;比如参考‌12&#xff0c;大模型的参数主要包括权重矩阵、偏置向量等。比如说&#xff0c;像LLaMA或者baichuan这样…

TP-LINK路由器如何设置网段、网关和DHCP服务

目标 ①将路由器的网段由192.168.1.XXX改为192.168.5.XXX ②确认DHCP是启用的&#xff0c;并将DHCP的IP池的范围设置为排除自己要手动指定的IP地址&#xff0c;避免IP冲突。 01-复位路由器 路由器按住复位键10秒以上进行重置操作 02-进入路由器管理界面 电脑连接到路由器&…

win11编译pytorch cuda128版本流程

Geforce 50xx系显卡最低支持cuda128&#xff0c;torch cu128 release版本目前还没有释放&#xff0c;所以自己基于2.6.0源码自己编译wheel包。 1. 前置条件 1. 使用visual studio installer 安装visual studio 2022&#xff0c;工作负荷选择【使用c的桌面开发】,安装完成后将…

React 中 useState 的 基础使用

概念&#xff1a;useState 是一个React Hook&#xff08;函数&#xff09;&#xff0c;它允许我们向组件添加状态变量&#xff0c;从而影响组件的渲染结果。 本质&#xff1a;和普通JS变量不同的是&#xff0c;状态变量一旦发生变化&#xff0c;组件的视图UI也会跟着变化&…