前端面试题139（你在开发过程中，使用过哪些TS的特性或者能力？）

1. Utility Types (工具类型)

1.1 Partial<T>

将类型 T 的所有属性变为可选。

interface Point {
  x: number;
  y: number;
}

type PartialPoint = Partial<Point>;

const point: PartialPoint = { x: 1 }; // 合法

1.2 Required<T>

将类型 T 的所有属性变为必选。

type RequiredPoint = Required<PartialPoint>;

const requiredPoint: RequiredPoint = { x: 1, y: 2 }; // 合法

1.3 Readonly<T>

将类型 T 的所有属性变为只读。

type ReadonlyPoint = Readonly<Point>;

const readonlyPoint: ReadonlyPoint = { x: 1, y: 2 };
readonlyPoint.x = 3; // 错误: 不能修改只读属性

1.4 Record<K, T>

创建一个具有指定键类型 K 和值类型 T 的新对象类型。

type StringToNumber = Record<string, number>;
const strToNum: StringToNumber = { one: 1, two: 2 };

1.5 Pick<T, K>

从类型 T 中选择指定属性 K 形成新类型。

type XCoord = Pick<Point, 'x'>;
const xCoord: XCoord = { x: 1 };

1.6 Omit<T, K>

从类型 T 中排除指定属性 K 形成新类型。

type YCoord = Omit<Point, 'x'>;
const yCoord: YCoord = { y: 2 };

1.7 Exclude<T, U>

从类型 T 中排除可以赋值给类型 U 的类型。

type ExcludeNumber = Exclude<number | string, number>;
const excludeNum: ExcludeNumber = "hello"; // 合法

1.8 Extract<T, U>

从类型 T 中提取可以赋值给类型 U 的类型。

type ExtractNumber = Extract<number | string, number>;
const extractNum: ExtractNumber = 123; // 合法

1.9 NonNullable<T>

从类型 T 中排除 null 和 undefined 类型。

type NonNullableType = NonNullable<number | null | undefined>;
const nonNullable: NonNullableType = 123; // 合法

1.10 ReturnType<T>

获取函数类型 T 的返回类型。

function add(a: number, b: number): number {
  return a + b;
}

type AddReturnType = ReturnType<typeof add>;
const result: AddReturnType = 3;

1.11 Parameters<T>

获取函数类型 T 的参数类型组成的元组类型。

type AddParameters = Parameters<typeof add>;
const params: AddParameters = [1, 2];

2. 条件判定类型

2.1 ConditionalTypes

根据类型关系进行条件判断生成不同的类型。

type Nullable<T> = T | null;
type NonNull<T> = T extends null | undefined ? never : T;

type NullableNumber = Nullable<number>;
type NonNullNumber = NonNull<NullableNumber>; // 结果为 number

2.2 DistributeConditionalTypes

分发条件类型，允许条件类型在联合类型上进行分发。

type Distribute<T> = T extends any ? T : never;

type DistributeUnion = Distribute<string | number | boolean>; // 结果为 string | number | boolean

3. Mapped Types (映射类型)

根据已有类型创建新类型，通过映射类型可以生成新的类型结构。

type ReadonlyPoint2 = {
  readonly [P in keyof Point]: Point[P];
};

const readonlyPoint2: ReadonlyPoint2 = { x: 1, y: 2 };
readonlyPoint2.x = 3; // 错误: 不能修改只读属性

4. Template Literal Types (模板文字类型)

使用字符串模板创建新类型。

type EventName = "click" | "dblclick";
type EventHandler<T extends EventName> = (event: T) => void;

const handleClick: EventHandler<"click"> = (event) => {
  console.log(event);
};

5. 类型推断关键字

5.1 keyof

关键字允许在泛型条件类型中推断类型变量。

type KeyOfPoint = keyof Point; // 结果为 "x" | "y"

5.2 instanceof

运算符用于检查对象是否是特定类的实例。

class Base {}
class Derived extends Base {}

const base = new Base();
const derived = new Derived();

if (derived instanceof Base) {
  // ...
}

5.3 in

用于检查对象是否具有特定属性。

const obj = { a: 1, b: 2 };

if ("a" in obj) {
  // ...
}

5.4 typeguards

类型守卫是自定义的函数或条件语句，用于在代码块内缩小变量的类型范围。

function isString(value: any): value is string {
  return typeof value === "string";
}

let value: any = "hello";

if (isString(value)) {
  value.toUpperCase(); // value 被缩小到 string 类型
}

5.5 as

用于类型断言，允许将一个变量断言为特定的类型。

let value: any = 123;
let num: number = value as number; // 断言为 number 类型