TypeScript 是 JavaScript 的一个超集，它添加了静态类型检查，使得开发者能够在编译时捕捉到潜在的错误。掌握 TypeScript 的类型系统对于提高代码质量、降低bug数量以及提升开发效率至关重要。以下是一些实用的 TypeScript 类型系统方法，帮助你轻松入门，高效编码，让 JavaScript 开发更安全。

一、基础类型

TypeScript 提供了丰富的基础类型，包括数字、字符串、布尔值、数组、元组、枚举等。正确使用这些基础类型可以确保你的代码在编译时就被检查，从而减少运行时错误。

1. 数字和字符串

let age: number = 30;
let name: string = '张三';

2. 布尔值

let isVIP: boolean = true;

3. 数组

let numbers: number[] = [1, 2, 3];
let strings: string[] = ['a', 'b', 'c'];

4. 元组

let point: [number, number] = [1, 2];

5. 枚举

enum Color {
  Red,
  Green,
  Blue
}
let c: Color = Color.Green;

二、高级类型

TypeScript 的高级类型包括接口、类型别名、联合类型、交叉类型、索引签名等。这些类型可以帮助你更精确地描述数据结构，提高代码的可读性和可维护性。

1. 接口

接口用于描述一个对象的结构，它可以包含多个属性和方法的定义。

interface Person {
  name: string;
  age: number;
}

function greet(person: Person): void {
  console.log(`Hello, ${person.name}!`);
}

2. 类型别名

类型别名可以给一个类型起一个新名字，方便在其他地方使用。

type StringArray = string[];
let words: StringArray = ['hello', 'world'];

3. 联合类型

联合类型表示一个变量可以是多个类型中的一种。

let input: string | number = 123;
input = '456'; // 正确
input = true; // 错误

4. 交叉类型

交叉类型表示一个变量可以同时具有多个类型的特征。

interface Animal {
  name: string;
}

interface Pet {
  age: number;
}

let pet: Animal & Pet = {
  name: '小猫',
  age: 3
};

5. 索引签名

索引签名用于描述对象类型的属性，可以包含字符串或数字类型的键。

interface StringArray {
  [index: number]: string;
}

let myArray: StringArray = ['a', 'b', 'c'];

三、泛型

泛型允许你在定义函数或类时使用类型参数，从而实现更灵活、可复用的代码。

function identity<T>(arg: T): T {
  return arg;
}

let output = identity<string>('your string'); // output: string

四、高级类型应用

在实际开发中，我们可以将上述类型结合起来，实现更复杂的类型系统。

1. 类型保护

类型保护可以帮助你判断一个变量是否属于某个特定的类型。

function isString(input: any): input is string {
  return typeof input === 'string';
}

function process(input: any) {
  if (isString(input)) {
    console.log(input.toUpperCase());
  } else {
    console.log(input.toFixed(2));
  }
}

2. 高阶类型

高阶类型指的是函数或类型参数接受其他类型作为参数或返回值的类型。

function createArray<T>(length: number, value: T): T[] {
  let result: T[] = [];
  for (let i = 0; i < length; i++) {
    result.push(value);
  }
  return result;
}

let array = createArray<string>(3, 'a');

五、总结

TypeScript 的类型系统可以帮助你轻松入门，高效编码，让 JavaScript 开发更安全。通过掌握基础类型、高级类型、泛型等概念，你可以编写更健壮、可维护的代码。希望本文能帮助你更好地理解 TypeScript 的类型系统，提升你的开发技能。