ts泛型接口

最新推荐文章于 2024-11-03 16:49:11 发布
最新推荐文章于 2024-11-03 16:49:11 发布
阅读量528 收藏
点赞数
分类专栏： vue3 文章标签： 前端 ui ts
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_43033748/article/details/121482650
版权
本文详细探讨了TypeScript中的泛型接口，包括其作用、如何定义和使用。通过实例解析，阐述了泛型接口如何提高代码复用性和灵活性，特别是在前端UI组件开发中的应用。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

interface iPerson<T1=string,T2=number>{
name:T1
age:T2
}
const p:iPerson={
name:"why",
age:18
}

TS 泛型类与类型约束
wuliCaibao的博客
08-11 1098
泛型类 注意： 不能用于类的静态成员 报错： 实例化： 注意： 实例化时可以不指定类型，此时函数调用时可以传入任意的数据类型 泛型约束 举个栗子： 报错： 泛型约束 注意：T继承了Length接口，表示T受到了一定约束，传入的参数需要具有length属性 比如： 小结：泛型的好处 1. 函数和类可以轻松的支持多种类型，增强程序的扩展性 2. 不必写多条函数重载，冗长的联合类型声明，增强代码的可读性 3. 灵活控制类型之间的约束 ...
鸿蒙开发TS基础：ArkTS语言之泛型类型和函数、泛型类和接口、泛型约束、泛型函数、泛型默认值
阿辉的博客
06-18 959
鸿蒙开发TS基础：ArkTS语言之泛型类型和函数、泛型类和接口、泛型约束、泛型函数、泛型默认值
ts中的泛型接口
yjwlike的博客
01-06 3741
在ts中常常会用接口来定义对象的类型, 用来规定对象中应该存在哪些属性, 这些属性是什么类型, 但是某些情况下, 我不希望对象中属性的类型固定, 而是我传入什么类型, 属性就是什么类型 , 此时就需要使用泛型接口 . 我们先定义一个接口 interface objType { money: (value: number) => number arr: () => string[] } const obj2: objType = { money: (val) => val,
ts：泛型接口、泛型类
小蜗牛764号的博客
10-29 1554
本来泛型接口和泛型类想分开各编写一篇博文的，后面发现相似处比较多，合起来编写工作量也不算太大，于是就合起来编写了。代码编写出来并不是很难，难的是编写出来后，要如何说明。某种意义上来说，代码其实已经是所要说的全部内容了。但是如果只把代码怼上去，文字说明啥的都不添加，后面回顾忘了咋办。还是尽量留点思路，后面忘了回顾过来也可以快些将知识捡回来。没有思路留下，后面回来估计会对代码发懵的。最近多了异步、接口的知识，但是时间类型也很重要，数组的方法也还有。
TS基础 类型 类 接口 泛型
WRhan的博客
07-29 2897
目录TS指南1. TS基本类型2. 类（class）3. 面向对象的特点3.1 封装3.1.1 只读属性（readonly）：3.1.2 属性三种修饰符：3.1.3 属性存取器3.1.4 静态属性3.1.5 this3.2 继承3.3 抽象类（abstract class）4. 接口（Interface）5. 泛型（Generic） TS指南 1. TS基本类型 类型声明语法： let 变量: 类型; let 变量：{ 属性1：类型， 属性2：类型， [propName: strin
TS — （1）泛型的定义，泛型接口，泛型类
sjsjsjsj1010的博客
04-11 1646
泛型的定义，泛型接口，泛型类的详细介绍与示例应用
Ts的接口、泛型、自定义类型
weixin_68376171的博客
01-24 1684
TypeScript（TS）是一种强类型的JavaScript超集，它为JavaScript代码提供了类型检查功能。在TypeScript中，接口（Interfaces）、泛型（Generics）和自定义类型（Custom Types）是定义和强化代码类型的三种重要方式。接口是用来定义对象、类或函数的形状（shape）的一种类型系统。泛型是一种可以在定义函数、接口、类的时候，不预先指定具体的类型，而是在使用的时候再指定类型的特性。自定义类型通常是指那些使用TypeScript提供的类型系统来创建的新类型。
TypeScript的泛型接口 泛型类接口.zip
11-05
本篇将深入探讨泛型接口和泛型类接口，以及如何在实际项目中应用它们。 首先，我们来理解泛型接口。在TypeScript中，接口（Interface）用于定义对象的结构，而泛型接口则是具有一个或多个类型参数的接口。这样，...
TS 泛型推断好难啊，看看你能写出来不
m0_56069948的博客
08-17 240
最近做东西都在用ts，有时候写比较复杂的功能，如果不熟悉，类型写起来还是挺麻烦的。有这样一个功能，在这里，我们就不以我们现有的业务来举例了，我们还是已Animal举例，来说明场景。通过一个工厂来创建不同的动物实例。在这里我们借助泛型来实现类型的约束和动态推到指定类型。...
ts类泛型接口扩展
lin_fightin的博客
06-23 2561
函数定义 ts是支持函数定义来定义类型的，ts的函数定义一般被称为泛型 如： 它的作用其实就是 可以看出来了，其实这种写法跟 是一样的，那么可以简单理解上面那个，就是传入一个T然后返回一个T，像函数一样， 只不过用来定义类型了 它支持任意类型的参数，然后返回任何类型。 扩展用法： 不管传什么始终返回string类型。看到这里大概对函数定义有一点了解了。 下面是扩展用法： 1 入参约束 使用extends可以有效限制入参的类型 2 默认值 很可惜现在还不能支持像arguments或者是…arg
TS泛型在函数、接口、类中使用介绍
u011200562的博客
06-02 1128
TS泛型在函数、接口、类中使用介绍
TypeScript：泛型接口
听海边涛声
08-11 240
TypeScript：泛型接口
TS（类 接口 泛型）
HBR666_的博客
11-03 1120
注意 对象结构不需要 implements一个interface继承另一个interface从而实现代码的复用何时使用接口1.定义对象的格式：描述数据模型，API响应格式，配置对象等等 是开发中用的最多的场景2.类的契约：规定一个类需要实现哪些属性和方法3.扩展已有接口：一般用于扩展第三方库的类型，这种特性在大型项目中可能会用到。
TypeScript 泛型介绍
weixin_58207509的博客
11-26 1582
泛型 泛型，顾名思义，就是可以适用于多个类型，使用类型变量比如T帮助我们捕获传入的类型，之后我们就可以继续使用这个类型。 本质是参数化类型，通俗的将就是所操作的数据类型被指定为一个参数，这种参数类型可以用在类、接口和函数的创建中，分别成为泛型类，泛型接口、泛型函数 泛型-泛型函数 创建泛型函数的格式 function fn<Type>(value: Type): Type { return value } // 上面的Type只是一个名字而已，可以改成其他的 function fn
TS泛型的使用，类型别名泛型的使用，泛型接口的使用（interface）
m0_56986233的博客
08-09 325
TS泛型的使用，类型别名泛型的使用，泛型接口的使用（interface）
TS中的类、接口、泛型
~
05-28 921
1、class class Person { // 实例属性【通过对象的实例去访问】 name: string = "美少女"; // 类属性(静态属性) ，在属性前加static关键字【直接访问】 static age: number = 17; // 只读属性 readonly sex:string = "female" // 实例方法 sayHello(){ console.log('hello') } // 类方法 static sayB
ts：泛型＜T＞
分享前端开发工程师的一些日常生活、前端知识点、职业发展、对一些问题的看法、感悟等等
06-28 1355
泛型（Generics）是指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性。 定义函数 //泛型函数的类型与非泛型函数的类型没什么不同，只是有一个类型参数在最前面，像函数声明一样 function createArray<T>(length: number, value: T): Array<T> { let result: T[] = []; for (let i = 0; i < length; i++) {
TypeScript--泛型（泛型类，泛型接口）
天行健 君子以自强不息，地势坤 君子以厚德载物。
03-13 579
泛型 泛型：软件工程中，我们不仅要创建一致的定义良好的API， 同时也要考虑可重用性。 组件不仅能够支持当前的数据类型， 同时也能支持未来的数据类型， 这在创建大型系统时为你提供了十分灵活的功能。 在像C#和Java这样的语言中， 可以使用泛型来创建可重用的组件， 一个组件可以支持多种类型的数据。 样用户就可以以自己的数据类型来使用组件。 通俗理解：泛型就是解决 类 接口 方法的复用性、 以及对不特定数据类型的支持(类型校验) 引例 同时返回 string类型 和number类型 //同时返回 st
【TS】接口
Superman_H的博客
07-19 463
# 约束对象的结构 ```ts interface MyInterface { name: string; age: number; } const obj: MyInterface = { name: "superman", age: 21 }; ``` # 约束函数的结构 ```ts interface MyInterface { (num1: number, num2: number): number; } const fun: MyInterfa
ts泛型使用
最新发布
03-18
<think>好的，用户想了解TypeScript中泛型的用法。首先，我需要回忆一下泛型的基本概念，以及它在TypeScript中的具体应用。泛型主要是用来增强代码的可重用性和类型安全，允许在定义函数、接口或类时不预先指定具体类型，而是在使用时再指定。 根据用户提供的引用内容，引用[2]提到了如何定义泛型函数，使用<T>来声明泛型类型，并在函数参数和返回值中使用。引用[1]和引用[3]则涉及泛型接口和泛型类的例子。需要把这些内容整理成用户容易理解的步骤。 首先，应该从泛型函数开始讲解，这是最基础的部分。然后介绍泛型接口，说明如何定义带有泛型的接口，并给出例子。接着是泛型类，展示在类中使用泛型的方法。最后可以提到泛型约束，虽然用户提供的引用中没有直接提到，但这也是泛型的一个重要部分，可以补充说明，比如使用extends关键字限制类型范围。 需要注意用户提供的示例代码，确保在回答中正确引用这些例子，比如引用[2]中的identity函数，引用[3]中的Hello接口和HelloNumber类。要检查这些代码是否符合TypeScript的语法，比如泛型函数和接口的定义是否正确。 用户可能对泛型的使用场景不太清楚，可能需要解释为什么使用泛型，比如避免any类型带来的类型信息丢失，提高代码灵活性和安全性。此外，可能还需要提到泛型在数组、Promise等常见场景中的应用，但根据提供的引用，可能需要集中在函数、接口和类上。 最后，生成相关问题时要围绕泛型的其他方面，比如约束、默认类型、高级类型等，或者与其他语言（如Java、C#）的泛型比较，帮助用户进一步学习。</think>### TypeScript 中泛型的使用方法 泛型（Generics）是 TypeScript 中用于增强代码复用性和类型安全的重要特性，允许在定义函数、接口或类时**不预先指定具体类型**，而是在使用时动态指定。以下是具体用法： --- #### 1. 泛型函数 定义函数时，使用 `<T>` 声明泛型类型（`T` 是占位符，可替换为其他名称），参数和返回值均可使用该类型： ```typescript function identity<T>(arg: T): T { return arg; } // 显式指定类型 const strResult = identity<string>("hello"); // 类型为 string // 类型推断 const numResult = identity(100); // 类型自动推断为 number ``` **作用**：避免使用 `any` 导致的类型信息丢失，同时支持多种类型[^2]。 --- #### 2. 泛型接口 接口中可通过泛型定义灵活的类型结构： ```typescript interface Hello<T> { (arg: T): T; } function myHello<T>(arg: T): T { return arg; } // 指定接口泛型类型为 number const mh: Hello<number> = myHello; console.log(mh(100)); // 输出 100 ``` **用途**：常用于回调函数或对象方法的类型约束[^3]。 --- #### 3. 泛型类 类可以通过泛型定义属性或方法的类型： ```typescript class HelloNumber<T> { zero: T; add: (x: T, y: T) => T; } // 实例化时指定泛型类型为 number const myHelloNumber = new HelloNumber<number>(); myHelloNumber.zero = 0; myHelloNumber.add = (x, y) => x + y; console.log(myHelloNumber.add(10, 20)); // 输出 30 ``` **优势**：类的内部逻辑可复用，同时保持类型一致性。 --- #### 4. 泛型约束 通过 `extends` 限制泛型类型的范围： ```typescript interface Lengthwise { length: number; } function logLength<T extends Lengthwise>(arg: T): void { console.log(arg.length); } logLength("hello"); // 输出 5（字符串有 length 属性） logLength([1, 2, 3]); // 输出 3 ``` **适用场景**：需要泛型类型满足特定条件时（如必须包含某个属性）。 --- #### 典型应用场景 - **数据处理函数**：如排序、转换等需支持多种类型的工具函数。 - **集合类**：数组、栈、队列等容器类的实现。 - **API 响应封装**：统一处理不同类型的数据返回值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

叮咚前端

你的鼓励是我们的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值