TypeScript 高级类型解释及示例

TypeScript 提供了几种超越基本类型的高级类型,从而实现了更灵活、更强大的类型系统。这些高级类型通过提供定义和执行类型约束的其他方式,帮助创建强大的应用程序。本文通过示例探讨了其中一些高级类型。

联合类型

联合类型允许变量为多种类型之一。当值可能属于多种类型但应根据其实际类型进行适当处理时,这很有用。

// Union type example

function formatValue(value: string | number): string {
  if (typeof value === 'string') {
    return `String: ${value}`;
  } else {
    return `Number: ${value.toFixed(2)}`;
  }
}

console.log(formatValue("Hello"));
console.log(formatValue(123.456));

在这个例子中,“formatValue”函数接受一个字符串或一个数字,并相应地格式化值。

交叉口类型

交叉类型将多种类型组合成一种。交叉类型的对象将具有组合类型的所有属性。这对于将多种类型组合在一起非常有用。

// Intersection type example

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

interface Contact {
  email: string;
  phone: string;
}

type Employee = Person & Contact;

const employee: Employee = {
  name: "John Doe",
  age: 30,
  email: "john.doe@example.com",
  phone: "123-456-7890"
};

console.log(employee);

这里,“Employee”类型是“Person”和“Contact”的交集,这意味着它包含两个接口的属性。

文字类型

文字类型指定变量可以保存的确切值。这对于确保只允许某些特定值特别有用。

// Literal type example

type Direction = "up" | "down" | "left" | "right";

function move(direction: Direction): void {
  console.log(`Moving ${direction}`);
}

move("up");    // Valid
move("down");  // Valid
// move("side"); // Error: Argument of type '"side"' is not assignable to parameter of type 'Direction'.

这里的“方向”类型限制为四个特定的字符串值,确保只有这些方向才能在“移动”函数中使用。

元组类型

元组类型表示具有固定数量元素的数组,其中每个元素可以具有不同的类型。元组适用于表示固定大小的异构项集合。

// Tuple type example

let user: [string, number] = ["Alice", 30];

console.log(user[0]); // "Alice"
console.log(user[1]); // 30

// user = [30, "Alice"]; // Error: Type 'number' is not assignable to type 'string'.

“用户”元组由一个字符串后跟一个数字定义,并且必须维护这个结构。

条件类型

条件类型允许根据条件确定类型。它们提供了一种根据条件选择一种类型或另一种类型的方法。

// Conditional type example

type IsString = T extends string ? "Yes" : "No";

type Test1 = IsString;  // "Yes"
type Test2 = IsString;  // "No"

在此示例中,`IsString` 类型检查类型 `T` 是否为字符串。如果是,则返回 `"Yes"`,否则返回 `"No"`。

映射类型

映射类型允许通过转换现有类型的属性来创建新类型。这对于修改或扩展现有类型非常有用。

// Mapped type example

type ReadonlyPerson = {
  readonly [K in keyof Person]: Person[K];
};

const readonlyPerson: ReadonlyPerson = {
  name: "Alice",
  age: 30
};

// readonlyPerson.age = 31; // Error: Cannot assign to 'age' because it is a read-only property.

`ReadonlyPerson` 类型通过使所有属性变为只读来转换 `Person` 类型。

结论

TypeScript 的高级类型提供了用于定义和管理复杂类型需求的强大工具。通过利用并集、交集、文字、元组、条件和映射类型,开发人员可以创建更强大且更易于维护的应用程序。理解并有效应用这些类型可以显著增强 TypeScript 代码的类型安全性和灵活性。