青训营X豆包MarsCode 技术训练营第二课 | 豆包MarsCode AI 刷题

75 阅读3分钟

第二篇伴学笔记~

今天复习了一下typescript泛型知识,以及进行了typescript的实践使用,对typescript有了更深的认识,记录如下:

一、TypeScript 中泛型的使用方法和场景

为什么使用泛型? 泛型允许你编写可以适用于多种不同类型的函数、类或接口,而不是针对特定的类型进行硬编码。这样可以提高代码的灵活性和可维护性。

例如,定义一个函数来返回数组中的第一个元素:

function firstElement(arr: any[]): any {
  return arr[0];
}

这里函数可以接受任何类型的数组,但返回值的类型是 any,这会失去类型安全性。使用泛型可以解决这个问题:

function firstElement<T>(arr: T[]): T {
  return arr[0];
}

现在这个函数可以接受任何类型的数组,并返回该类型的第一个元素

  1. 泛型函数

    • 定义:泛型函数是可以适用于不同类型参数的函数。在函数名后面使用尖括号<T>来表示泛型类型参数。
  2. 泛型类

    • 定义:泛型类可以有一个或多个类型参数,这些参数在类的成员中使用。
  1. 泛型接口

    • 定义:泛型接口可以定义带有类型参数的接口。
 function fn<T>(a: T): T {
   return a
 }
 fn('123')//不指定泛型,ts会直接对类型进行推断
 fn<number>(1)//指定泛型
 interface myinter {
   length: number
 }
 function fn2<K extends myinter>(b: K): K {
   console.log(b.length);
   return b
 }
 fn2('123')//3
 class Student<T>{
   name: T
   constructor(name:T) {
     this.name = name
   }
 }

当不确定参数类型但是不同参数类型处理逻辑相同可以使用泛型来简化逻辑,而且能让代码更有利于维护

二、使用类型约束增加代码的灵活性和安全性

  1. 类型约束

    • 定义:可以使用 extends 关键字对泛型类型参数进行约束,指定泛型类型必须满足的条件。
    function loggingIdentity<T extends Lengthwise>(arg: T): T {
      console.log(arg.length);
      return arg;
    }
    interface Lengthwise {
      length: number;
    }
  • 场景:当需要对泛型类型进行一些特定的操作,而这些操作只对具有某些特定属性的类型有效时,可以使用类型约束。比如,上面的例子中,只有具有 length 属性的类型才能作为参数传递给 loggingIdentity 函数。
  1. 多个类型约束

    • 定义:可以使用 & 符号对泛型类型参数进行多个约束。
 interface Nameable {
      name: string;
 }
 class Person implements Nameable {
      name: string;
 }
 function greet<T extends Nameable & AnotherInterface>(person: T) {
      console.log(`Hello, ${person.name}!`);
 }
  • 场景:当需要泛型类型同时满足多个条件时,可以使用多个类型约束。比如,上面的例子中,泛型类型 T 必须同时实现 Nameable 和 AnotherInterface 接口。

总之,TypeScript 中的泛型提供了一种强大的方式来编写灵活、可复用的代码。通过使用类型约束,可以增加代码的安全性,确保泛型类型满足特定的条件。在实际开发中,根据具体的需求合理地使用泛型和类型约束,可以提高代码的质量和可维护性。