教程 ts tutorial

高级类型

TypeScript 的高级类型使得在处理更复杂的数据结构时,可以更细致地控制类型的行为和检查,增强了类型系统的表达能力。

联合类型与类型保护

联合类型(|)表示变量可以是多种类型中的一种。类型保护(typeof, instanceof, in)可以帮助确定变量的具体类型。

ts
function print(value: string | number) {
  if (typeof value === "string") {
    console.log("String:", value);
  } else {
    console.log("Number:", value);
  }
}

类型断言与非空断言

类型断言

类型断言允许告诉 TypeScript 我们已经知道某个变量的具体类型:

ts
let someValue: any = "Hello";
let strLength: number = (someValue as string).length;

非空断言(!)

使用 ! 断言非 null 或 undefined:

ts
let element = document.getElementById("myElement");
element!.textContent = "Hello!";

字面量类型

字面量类型是对某个特定值的精确描述,常用于更细粒度的类型约束。

ts
type Direction = "up" | "down" | "left" | "right";
let move: Direction = "up"; // 只允许这些字面量值

映射类型

映射类型用于创建新类型,它基于给定的类型并对其做一些变换。

ts
type ReadOnly<T> = {
  readonly [K in keyof T]: T[K];
};

type Person = { name: string; age: number };
type ReadOnlyPerson = ReadOnly<Person>;
// { readonly name: string; readonly age: number }

条件类型

条件类型根据类型的不同,决定类型的结构。它们的形式是 T extends U ? X : Y。

ts
type IsString<T> = T extends string ? "Yes" : "No";
type Test1 = IsString<string>; // "Yes"
type Test2 = IsString<number>; // "No"

keyof、typeof、infer 等关键字用法

keyof

keyof 返回一个类型的键名组成的联合类型:

ts
type Person = { name: string; age: number };
type PersonKeys = keyof Person; // "name" | "age"

typeof

typeof 用于获取变量的类型:

ts
let person = { name: "John", age: 30 };
type PersonType = typeof person; // { name: string; age: number }

infer

infer 用于推断类型,是一种在条件类型中使用的关键字:

ts
type ReturnType<T> = T extends (a: any) => infer R ? R : never;
type Func = (x: number) => string;
type ReturnTypeOfFunc = ReturnType<Func>; // string

高级类型使得 TypeScript 的类型系统更加强大,开发者可以根据需求实现更复杂的类型推断与约束,提升代码的安全性与可维护性。