探索 TS 中的类型：构建强大而安全的代码

2024-01-22 14:21:18

从 JavaScript 的类型说起

在 JavaScript 中，类型分为基本类型和引用类型。基本类型包括布尔型、数字型、字符串型和 undefined 型。引用类型包括对象型、数组型和函数型。其中，对象型是 JavaScript 中最为重要的类型，它可以包含各种属性和方法，并可以作为其他对象的原型。

TS 扩展的类型

TS 在 JavaScript 的基础上扩展了类型系统，引入了许多新的类型，包括：

联合类型 ：联合类型允许一个变量同时具有多种类型。例如，你可以声明一个变量既可以是字符串型也可以是数字型。
元组类型 ：元组类型是另一种复合类型，它可以包含不同类型的值。例如，你可以声明一个元组类型，其中包含一个字符串型和一个数字型。
枚举类型 ：枚举类型是一种特殊类型的联合类型，它可以包含一组有限的值。例如，你可以声明一个枚举类型，其中包含周一、周二、周三、周四、周五、周六和周日。
接口类型 ：接口类型是一种抽象类型，它定义了一个对象应该具有哪些属性和方法。例如，你可以声明一个接口类型，其中包含一个名为 "getName" 的方法和一个名为 "age" 的属性。
类类型 ：类类型是一种复合类型，它可以包含属性、方法和构造函数。例如，你可以声明一个类类型，其中包含一个名为 "name" 的属性和一个名为 "sayHello" 的方法。

TS 中的新增：函数返回类型

在 JavaScript 中，函数的返回类型是隐式的。这意味着，编译器并不会检查函数是否返回了正确类型的值。这可能会导致一些难以察觉的错误。

TS 引入了函数返回类型，它允许你指定函数应该返回什么类型的值。这可以帮助编译器检查函数是否返回了正确类型的值，从而避免错误。

灵活运用 TS 中的类型

TS 中的类型系统非常灵活，你可以根据自己的需求来使用它。你可以使用类型注解来显式地指定变量、参数和函数的返回类型。你也可以使用类型推断来让编译器自动推断出变量、参数和函数的返回类型。

TS 中的类型系统可以帮助你构建更强大、更安全的代码。它可以帮助你避免错误，提高代码的可读性和可维护性。

举一反三：类型在 TS 中的妙用

为了更好地理解 TS 中的类型，我们来看几个实际的例子。

示例 1：使用联合类型来定义一个可以保存不同类型数据的变量

let data: string | number;

data = "Hello";
data = 123;

示例 2：使用元组类型来定义一个包含不同类型数据的数组

let data: [string, number];

data = ["Hello", 123];

示例 3：使用枚举类型来定义一组有限的值

enum DayOfWeek {
  Monday,
  Tuesday,
  Wednesday,
  Thursday,
  Friday,
  Saturday,
  Sunday
}

let today: DayOfWeek;

today = DayOfWeek.Monday;

示例 4：使用接口类型来定义一个对象应该具有哪些属性和方法

interface Person {
  name: string;
  age: number;
  sayHello(): void;
}

let person: Person;

person = {
  name: "John",
  age: 30,
  sayHello: function() {
    console.log("Hello, my name is John!");
  }
};

示例 5：使用类类型来定义一个对象

class Person {
  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log("Hello, my name is " + this.name + "!");
  }
}

let person = new Person("John", 30);

person.sayHello();