方括号运算符[]

数组当然需要使用[]，在 Javascript 中我们经常使用[]来获取数组的值，或者动态引用获取对象属性的值

const arr = ["a", "b", "c", "d", "e"];
console.log(arr[1]); // b

const a = "name";
const obj = {
  id: 1,
  name: "jack",
};
console.log(obj[a]); // jack

在 Typescript 中，方括号运算符[]用于类型计算，取出对象类型的键对应的值的类型，比如类型[键名]，简写为T[K]会返回T类型的属性K的类型。

type Person = {
  age: number;
  name: string;
  sex: boolean;
};

type Age = Person["age"]; // number类型

方括号的参数如果是联合类型，那么返回的也是联合类型。

type AgeOrName = Person["age" | "name"]; // string | number

甚至可以获取数组的具体类型，注意下面的写法：

const arr = ["a", "b", "c", "d", "e"];
type ArrType = (typeof arr)[number]; // string

因为在 Javascript 中，数组其实就是key:value的键值对，而数组的键也就是下标都是 number 类型

同样，如果是一个对象字面量类型的数组，一样会得到数组中对象字面量类型：

type User = {
  name: string;
  age: number;
};

const users: User[] = [
  { name: "John", age: 25 },
  { name: "Steve", age: 30 },
  { name: "Mike", age: 35 },
];

type ArrType2 = (typeof users)[number]; // { name: string; age: number;}

如果是一个元组，就可以得到元组类型中所有位置上类型的联合类型：

const roles: ["Admin", "User", "Guest"] = ["Admin", "User", "Guest"];
type ArrType3 = (typeof roles)[number]; // "Admin" | "User" | "Guest"