TypeScript 泛型

TypeScript 泛型
一、泛型函数/方法
typescript 复制代码
// 定义
funName<T>(arg:T):T {
    return arg;
  }

// 调用
aboutToAppear(): void {
    this.funName<string>('aaa')
  }
二、泛型接口
typescript 复制代码
interface Comparator<T> {
  age:T
  compareTo(value:T): number;
}
三、泛型类
typescript 复制代码
class MyMap<K, V> {
  key: K;
  value: V;

  constructor(key: K, value: V) {
    this.key = key;
    this.value = value;
  }
}

鸿蒙需要给key,value初始化的。

也可以改为可选参数形式,就不用初始化了。

typescript 复制代码
class MyMap<K, V> {
  key?: K;
  value?: V;
  
}
四、泛型的类型别名
typescript 复制代码
type Box<T> = {
  content: T;
  isEmpty: boolean;
};

// 使用示例
const stringBox: Box<string> = {
  content: "Hello World",
  isEmpty: false
};

但鸿蒙api12后就不能这样定义了。api12后每个对象都要有具体类型

只好修改为接口的泛型

typescript 复制代码
interface Box<T> {
  content: T;
  isEmpty: boolean;
}

// 使用示例
const stringBox: Box<string> = {
  content: "Hello World",
  isEmpty: false
};
五、泛型的默认类型
typescript 复制代码
function getFirst<T = string>(
  arr:T[]
):T {
  return arr[0];
}

调用时可不指定类型,不指定就用string类型

六、泛型的约束
typescript 复制代码
// 约束接口 - 必须有 length 属性
interface Lengthwise {
  length: number;
}

// 泛型约束 - T 必须实现 Lengthwise 接口
function getLength<T extends Lengthwise>(arg: T): number {
  return arg.length;
}

// 使用示例
console.log(getLength("Hello")); // 5
console.log(getLength([1, 2, 3, 4, 5])); // 5
console.log(getLength({ length: 10, name: "test" })); // 10
// console.log(getLength(123)); // 错误:number 没有 length 属性
相关推荐
何何____2 小时前
TypeScript 函数类型兼容性
前端·javascript·typescript
VimorphTech5 小时前
React 任务轮询,为什么不能只写一个 setInterval?
javascript·typescript
const_qiu1 天前
第二章 2.6:初始化 NestJS 服务端 —— TypeScript 后端框架体验
前端·javascript·typescript
RobinDevNotes2 天前
一套代码发布到十几个平台:Cocos入门速览
typescript·c#·游戏开发
前端小L2 天前
typescript基础
typescript
濮水大叔2 天前
CabloyJS 的 AI 时刻:从 TypeScript 全栈框架到 AI 规范驱动开发
typescript·ai编程·全栈
程序员Sunday3 天前
TypeScript 的 any、unknown、never 有什么区别?
前端·面试·typescript
三十而立洋3 天前
TypeScript 7.0 深度解析:新特性、Go 原生编译器及与 TypeScript 6.0 的区别
前端·typescript·前端工程化
VimorphTech3 天前
React 自动保存怎么设计?防抖、串行请求与导出前等待
后端·typescript
yuanlaile3 天前
做了 3 年后端才明白:学 NestJS 千万不要只学 API 语法,完整电商项目才是分水岭
typescript·nestjs·node.js 后端·nestjs实战