TypeScript的几种类型保护方式-51CTO.COM

TypeScript 的类型保护（Type Guards）是一种确保在代码运行时可以更精确地处理特定类型的方法。通过类型保护，TypeScript 能够根据特定的条件（如值的属性或操作方式）推断变量的类型，从而减少类型错误的可能性。

常见的几种类型保护方式

typeof 类型保护
instanceof 类型保护
in 操作符
自定义类型保护函数（Type Predicates）
字面量类型守护（Discriminated Unions）

1. typeof 类型保护

typeof 是 JavaScript 中的一个操作符，TypeScript 使用它来检查基本数据类型（如 string, number, boolean）。常用于保护原始类型。

示例：

function printValue(value: string | number) {
  if (typeof value === "string") {
    console.log("The value is a string:", value.toUpperCase());
  } else {
    console.log("The value is a number:", value.toFixed(2));
  }
}

printValue("Hello"); // The value is a string: HELLO
printValue(123.456); // The value is a number: 123.46

在这个例子中，typeof 通过检查 value 是 string 还是 number 来选择合适的操作。

2. instanceof 类型保护

instanceof 检查某个对象是否是另一个对象的实例（即其构造函数的原型是否出现在该对象的原型链中）。适用于类实例的类型保护。

示例：

class Dog {
  bark() {
    console.log("Woof!");
  }
}

class Cat {
  meow() {
    console.log("Meow!");
  }
}

function makeSound(animal: Dog | Cat) {
  if (animal instanceof Dog) {
    animal.bark(); // Safe to call bark() here
  } else {
    animal.meow(); // Safe to call meow() here
  }
}

const myDog = new Dog();
const myCat = new Cat();

makeSound(myDog); // Woof!
makeSound(myCat); // Meow!

在这个例子中，instanceof 检查对象是否是 Dog 或 Cat 的实例，以选择调用哪个方法。

3. in 操作符

in 操作符检查对象中是否存在某个属性，这对于联合类型中可能包含不同属性的情况非常有用。

示例：

interface Car {
  drive(): void;
}

interface Boat {
  sail(): void;
}

function move(vehicle: Car | Boat) {
  if ("drive" in vehicle) {
    vehicle.drive(); // Safe to call drive() here
  } else {
    vehicle.sail(); // Safe to call sail() here
  }
}

const car: Car = {
  drive() {
    console.log("Driving the car");
  },
};

const boat: Boat = {
  sail() {
    console.log("Sailing the boat");
  },
};

move(car);  // Driving the car
move(boat); // Sailing the boat

这里，in 操作符检查 vehicle 是否有 drive 属性，以此决定执行 drive() 或 sail()。

4. 自定义类型保护函数（Type Predicates）

通过使用类型谓词（Type Predicates），可以创建自定义的类型保护函数。类型谓词的语法是：param is Type，它表明如果函数返回 true，则 param 的类型为 Type。

示例：

interface Fish {
  swim(): void;
}

interface Bird {
  fly(): void;
}

function isFish(animal: Fish | Bird): animal is Fish {
  return (animal as Fish).swim !== undefined;
}

function moveAnimal(animal: Fish | Bird) {
  if (isFish(animal)) {
    animal.swim(); // TypeScript knows `animal` is a Fish
  } else {
    animal.fly(); // TypeScript knows `animal` is a Bird
  }
}

const fish: Fish = {
  swim() {
    console.log("The fish is swimming");
  },
};

const bird: Bird = {
  fly() {
    console.log("The bird is flying");
  },
};

moveAnimal(fish); // The fish is swimming
moveAnimal(bird); // The bird is flying

在这个例子中，isFish 是一个自定义类型保护函数。它检查 animal 是否为 Fish，并根据类型来调用相应的方法。

5. 字面量类型守护（Discriminated Unions）

字面量类型守护是通过在联合类型中引入一个区分字段（discriminant field）来实现的。通常在每个类型中使用一个固定的字面量属性来进行类型保护。

示例：

interface Square {
  kind: "square";
  size: number;
}

interface Rectangle {
  kind: "rectangle";
  width: number;
  height: number;
}

interface Circle {
  kind: "circle";
  radius: number;
}

type Shape = Square | Rectangle | Circle;

function getArea(shape: Shape): number {
  switch (shape.kind) {
    case "square":
      return shape.size * shape.size;
    case "rectangle":
      return shape.width * shape.height;
    case "circle":
      return Math.PI * shape.radius * shape.radius;
    default:
      return 0;
  }
}

const square: Square = { kind: "square", size: 5 };
console.log(getArea(square)); // 25

在这个例子中，Shape 类型是由 Square, Rectangle 和 Circle 组成的联合类型，它们都有 kind 字段，通过这个字段我们可以区分出当前的具体类型并相应处理。

总结

TypeScript 提供了多种类型保护方式来安全地处理联合类型或复杂的类型结构：

typeof: 用于检查基本数据类型 (string, number, boolean)。
instanceof: 用于检查对象是否是某个类的实例。
in: 用于检查对象是否具有某个属性。
自定义类型保护函数: 通过类型谓词创建自定义的类型保护函数。
字面量类型守护（Discriminated Unions）: 使用区分字段来区分联合类型中的不同类型。

这些类型保护方式可以帮助你在 TypeScript 中更安全地编写代码，并减少运行时错误。