返回

用神奇的联合类型和类型断言,重拾Typescript

前端

重温神奇的TypeScript:联合类型与类型断言

在TypeScript的世界里,联合类型与类型断言像两颗闪亮的星星,交相辉映,为开发人员带来了无尽的便利。联合类型允许你将多种类型组合在一起,而类型断言则能让你明确地告诉编译器某个变量的类型,即便它不符合类型推断的规则。

联合类型:多种类型的结合

联合类型就像一个神奇的融合剂,可以将多种类型合而为一,创造出更加丰富的类型定义。比如,你可以创建一个名为Pet的联合类型,包含Dog和Cat两个类型,这样你就可以用Pet类型来表示宠物,而无需关心它到底是狗还是猫。

type Pet = Dog | Cat;

function feedPet(pet: Pet) {
  if (pet instanceof Dog) {
    pet.bark();
  } else if (pet instanceof Cat) {
    pet.meow();
  }
}

在这个例子中,feedPet函数可以接受任何Pet类型的参数,并根据参数的不同类型调用不同的方法。这使得代码更加灵活,也更加易于维护。

类型断言:明确地指定类型

类型断言就像一个强有力的声明,可以明确地告诉编译器某个变量的类型,即便它不符合类型推断的规则。这在某些情况下非常有用,比如当你想将一个变量强制转换为另一种类型时。

let x: any = 123;
let y = x as number; // 将x强制转换为number类型

在这个例子中,x变量被声明为any类型,这意味着它可以是任何类型。但是,我们使用类型断言将x强制转换为number类型,这样编译器就知道y变量是一个number类型的变量。

联合类型与类型断言的强大组合

联合类型与类型断言的组合可以让你轻松实现各种类型和数据的组合,为代码的可读性和维护性提供极大的帮助。比如,你可以使用联合类型来定义一个函数的参数类型,并使用类型断言来明确地指定函数的返回值类型。

function sum(x: number | string, y: number | string): number | string {
  if (typeof x === 'number' && typeof y === 'number') {
    return x + y;
  } else {
    return x.toString() + y.toString();
  }
}

let result = sum(1, 2); // number
result = sum('1', '2'); // string

在这个例子中,sum函数的参数类型是number | string,这意味着它可以接受number类型或string类型