基础类型系统介绍

基础类型系统介绍

TypeScript 的类型系统是它的核心特性之一，为 JavaScript 添加了静态类型检查能力。类型系统可以帮助开发者在编码阶段发现潜在的错误，提高代码的可维护性和可读性。TypeScript 的类型系统包括基本类型、联合类型、交叉类型、类型别名、接口等。

基本类型

TypeScript 提供了一些基本类型，与 JavaScript 的基本类型相对应。这些类型包括：

• number: 表示数字，包括整数和浮点数。
• string: 表示字符串。
• boolean: 表示布尔值，true 或 false。
• null 和 undefined: 分别表示 null 和 undefined 值。
• symbol: 表示唯一的符号值。
• bigint: 表示大整数。

let age: number = 25;
let name: string = "Alice";
let isStudent: boolean = true;
let nothing: null = null;
let notDefined: undefined = undefined;
let uniqueSymbol: symbol = Symbol("unique");
let bigNumber: bigint = 100n;

数组和元组

TypeScript 支持数组和元组类型，用于表示一组有序的值。

• 数组类型可以通过 类型[] 或 Array<类型> 来定义。
• 元组类型用于表示一个固定长度和类型的数组。

// 数组
let numbers: number[] = [1, 2, 3];
let names: Array<string> = ["Alice", "Bob", "Charlie"];

// 元组
let person: [string, number] = ["Alice", 25];
let rgb: [number, number, number] = [255, 0, 0];

联合类型和字面量类型

联合类型允许一个变量可以是多种类型之一，而字面量类型允许将值限制为特定的字面量。

// 联合类型
let id: string | number = "123";
id = 123; // 合法

// 字面量类型
let direction: "north" | "south" | "east" | "west" = "north";
direction = "south"; // 合法
// direction = "up"; // 错误：类型不匹配

类型别名和接口

类型别名和接口用于定义复杂的类型结构。

• 类型别名使用 type 关键字定义。
• 接口使用 interface 关键字定义，支持扩展和实现。

// 类型别名
type Point = {
  x: number;
  y: number;
};

let p1: Point = { x: 10, y: 20 };

// 接口
interface Person {
  name: string;
  age: number;
}

let alice: Person = { name: "Alice", age: 25 };

// 接口扩展
interface Employee extends Person {
  jobTitle: string;
}

let bob: Employee = { name: "Bob", age: 30, jobTitle: "Developer" };

枚举

枚举类型用于定义一组命名的常量值。

enum Color {
  Red,
  Green,
  Blue,
}

let c: Color = Color.Green;
console.log(c); // 输出: 1

// 字符串枚举
enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

let d: Direction = Direction.Up;
console.log(d); // 输出: "UP"

类型推断和类型断言

TypeScript 具有强大的类型推断能力，可以根据上下文自动推断变量的类型。类型断言允许开发者手动指定一个值的类型。

// 类型推断
let x = 10; // x 被推断为 number 类型
let y = "hello"; // y 被推断为 string 类型

// 类型断言
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;
// 或者使用尖括号语法（不推荐在 JSX 中使用）
let strLength2: number = (<string>someValue).length;

函数类型

TypeScript 允许为函数参数和返回值指定类型。

// 函数参数和返回值类型
function add(a: number, b: number): number {
  return a + b;
}

// 可选参数和默认参数
function greet(name: string, greeting: string = "Hello"): void {
  console.log(`${greeting}, ${name}!`);
}

// 剩余参数
function sum(...numbers: number[]): number {
  return numbers.reduce((acc, curr) => acc + curr, 0);
}

泛型

泛型允许在定义函数、接口或类时不预先指定具体类型，而是在使用时再指定。

// 泛型函数
function identity<T>(arg: T): T {
  return arg;
}

let output = identity<string>("hello");
let output2 = identity<number>(42);

// 泛型接口
interface GenericArray<T> {
  [index: number]: T;
}

let myArray: GenericArray<number> = [1, 2, 3];

// 泛型类
class GenericBox<T> {
  private value: T;

  constructor(value: T) {
    this.value = value;
  }

  getValue(): T {
    return this.value;
  }
}

let box = new GenericBox<string>("secret");
console.log(box.getValue()); // 输出: "secret"

高级类型

TypeScript 提供了一些高级类型工具，用于处理更复杂的类型场景。

// 映射类型
type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

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

type ReadonlyPerson = Readonly<Person>;
// ReadonlyPerson 等同于:
// {
//   readonly name: string;
//   readonly age: number;
// }

// 条件类型
type IsString<T> = T extends string ? true : false;

type A = IsString<"hello">; // true
type B = IsString<123>; // false

// 索引访问类型
type PersonName = Person["name"]; // string
type PersonKeys = keyof Person; // "name" | "age"