TypeScript 中的类型转换及使用方法-JavaScript中文网-JavaScript教程资源分享门户

什么是 TypeScript ?

TypeScript 是由微软开发的一种静态类型语言，是 JavaScript 的超集。它通过添加类型注释来使程序的类型更加明确，以帮助开发人员在开发过程中检测错误，提高代码的可维护性和可读性，并提供了更好的代码提示功能，从而提高编写代码的效率。

基础类型转换

我们在 TypeScript 中，可以使用 as 关键字完成类型转换。as 在语法上相当于类型断言，但是具有运行时意义。基本使用方法如下：

var foo: any = "hello world!";
var bar: string = foo as string;

在这个例子中，我们将 foo 的类型从 any 转化为了 string，这样我们可以在后面的代码中使用 bar 变量的所有 string 类型的方法和属性了。

类型保护

TypeScript 还提供了很多辅助开发者进行类型保护的工具，以帮助开发者避免在代码中出现类型错误。

首先，我们来了解一下基本类型保护：

typeof

我们可以使用 typeof 关键字获取一个变量的类型信息，例如：

function printAge(age: number | string) {
  if (typeof age === "number") {
    console.log(`You are ${age} years old!`);
  } else {
    console.log("Age must be a number.");
  }
}

在这个例子中，我们使用了 typeof 来检验 age 变量是否为 number 类型。

instanceof

我们可以使用 instanceof 关键字来检查一个对象是否为另一个对象的实例，例如：

// javascriptcn.com 代码示例
class Cat {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

class Dog {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

function printPet(pet: Cat | Dog) {
  if (pet instanceof Cat) {
    console.log(`Your cat ${pet.name} is cute!`);
  } else if (pet instanceof Dog) {
    console.log(`Your dog ${pet.name} is cute too!`);
  }
}

在这个例子中，我们使用 instanceof 来检验 pet 变量是否为 Cat 或 Dog 类的实例。

in

我们可以使用 in 关键字来检查一个属性是否存在于一个对象中，例如：

// javascriptcn.com 代码示例
interface Person {
  name: string;
  age?: number;
}

function printPerson(person: Person) {
  if ("age" in person) {
    console.log(`${person.name} is ${person.age} years old!`);
  } else {
    console.log(`${person.name} does not have an age!`);
  }
}

在这个例子中，我们使用 in 来检验 person 对象中是否存在 age 属性。

自定义类型保护

除了上面的基本类型保护，我们还可以自定义类型保护，提高代码的可读性和可维护性。

// javascriptcn.com 代码示例
interface Machine {
    start(): void;
    stop(): void;
}

interface Clock {
    tick(): void;
}

function isMachine(object: Machine | Clock): object is Machine {
    return (<Machine>object).start !== undefined;
}

function isClock(object: Machine | Clock): object is Clock {
    return (<Clock>object).tick !== undefined;
}

function runMachine(machine: Machine | Clock) {
    if (isMachine(machine)) {
        machine.start();
        machine.stop();
    } else if (isClock(machine)) {
        setInterval(() => {
            machine.tick();
        }, 1000);
    }
}

在这个例子中，我们分别定义了 isMachine 和 isClock 两个函数来判断一个对象是属于 Machine 还是 Clock 类型。通过这种方式，我们可以避免在代码中频繁地使用 instanceof 和 in 关键字来进行类型判断，提高代码的可读性和可维护性。

总结

本文介绍了 TypeScript 中的类型转换和类型保护相关的知识点，包括基本类型转换、typeof、instanceof、in、自定义类型保护等。通过使用这些方法，我们可以避免在代码中出现类型错误，并提高代码的可读性和可维护性。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/652ec15a7d4982a6ebfd5404