面试导航

1. 基础类型

基础类型就没啥好讲的， TypeScript 最基本的类型，包括 string、number、boolean、null、undefined、void、symbol 等。跟 JavaScript 差不多。

2. 数组类型

数组类型用来表示元素类型一致的数组。可以通过两种方式定义数组类型：


const list: number[] = [1, 2, 3];
const list: Array<number> = [1, 2, 3];

3. 元组类型

元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。


let x: [string, number];
x = ['hello', 10]; // 合法
x = [10, 'hello']; // 不合法

4. 枚举类型

枚举类型用于定义一组命名常量，可以是数字或字符串。


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

5. Any 类型

any 类型表示任意类型的值，使用 any 类型可以跳过类型检查。


let notSure: any = 4;
notSure = 'maybe a string instead';
notSure = false;

6. Unknown 类型

unknown 类型表示未知类型的值，类似于 any，但更安全，因为对 unknown 类型的值进行操作之前需要进行类型检查。


let notSure: unknown = 4;
notSure = 'maybe a string instead';
notSure = false;
 
if (typeof notSure === 'string') {
  console.log(notSure.toUpperCase());
}

7. Never 类型

never 类型表示那些永不存在的值类型，例如总是会抛出错误或无限循环的函数的返回值


function error(message: string): never {
  throw new Error(message);
}

8. 函数类型

函数类型用于定义函数的参数类型和返回值类型。


const moment: (x: number, y: number) => number = function (x: number, y: number): number {
  return x + y;
};

9. 交叉类型

交叉类型用来组合多个类型成一个类型，表示对象可以同时具有多个类型的成员。


interface Person {
  name: string;
}
 
interface Contact {
  phone: string;
}
 
type PersonContact = Person & Contact;
 
const contact: PersonContact = {
  name: 'moment',
  phone: '1234567890',
};

10. 索引类型

索引类型允许使用动态属性名来访问类型中的属性。


interface Person {
  name: string;
  age: number;
}
 
type PersonKeys = keyof Person; // "name" | "age"
type NameType = Person['name']; // string

当然，下面是关于 TypeScript 中条件类型、联合类型、递归类型和映射类型的详细讲解。

11. 条件类型

条件类型是一种基于类型的条件判断语法，可以根据条件返回不同的类型。语法如下：


T extends U ? X : Y

这表示如果类型 T 能够赋值给类型 U，那么返回类型 X，否则返回类型 Y。

示例：


type IsString<T> = T extends string ? true : false;
 
type A = IsString<string>; // true
type B = IsString<number>; // false

12. 联合类型

联合类型允许一个变量可以是几种类型之一。用竖线 | 分隔不同的类型。

示例：


type MyUnion = string | number | boolean;
 
let value: MyUnion;
 
value = 'Hello'; // 合法
value = 123; // 合法
value = true; // 合法
value = {}; // 不合法

13. 递归类型

递归类型是指类型引用自身的一部分，用于定义复杂的嵌套结构，如树结构、链表等。

示例：


interface TreeNode {
  value: string;
  children?: TreeNode[];
}
 
const tree: TreeNode = {
  value: 'root',
  children: [
    { value: 'child1' },
    {
      value: 'child2',
      children: [{ value: 'grandchild1' }],
    },
  ],
};

14. 映射类型

映射类型是一种根据已存在的类型生成新类型的方法。它通过在类型中遍历已有的键来创建新的类型。

示例：


type MyReadonly<T> = {
  readonly [P in keyof T]: T[P];
};
 
type Person = {
  name: string;
  age: number;
};
 
type ReadonlyPerson = MyReadonly<Person>;
 
const person: ReadonlyPerson = {
  name: 'Alice',
  age: 30,
};
 
person.name = 'Bob'; // 报错，name 是只读属性

如下图所示：

总结

通过学习这些基本的类型可以方便我们学习后面更复杂的 ts 类型，例如一些比较复杂的类型体操。

面试导航 - 程序员面试题库大全 | 前端后端面试真题 | 面试