一文讀懂TS in操作符

in操作符作用: 遍歷類型

基本用法

type roles = "tester" | "developer" | "manager";
const staffCount: { [k in roles]: number } = {
  tester: 100,
  developer: 200,
  manager: 300,
};

上述代碼規定 staffCount 是一個對象,屬性名為 roles 約束的三個,值為 number 類型

1. 類型變數 k,以此綁定到對象的每一個屬性
2. 遍歷三個字元串字面量組成的聯合類型 roles
3. number 為每個屬性的值的類型

類型映射

在映射類型里，新類型以新的規則轉換基類型的每一條規則.類似於class的繼承

interface publicObj {
  // 定義一個開放的對象
  name: string;
  age: number;
}

type ReadonlyObj<T> = { // 需要傳遞一個類型參數
  readonly [K in keyof T]: T[K]; // keyof T 返回聯合類型 in 再遍歷該聯合類型
};
// 使用
let obj: ReadonlyObj<publicObj> = {
  name: "myName",
  age: 6,
};
obj.name = "yourName"; // 無法分配到 "name" ，因為它是只讀屬性。ts(2540)

TIPS
T[k]表示值為 T 的每一個屬性的類型 類似於 JS 中
for (const key in obj) {
obj[key];
}
中的 obj[key]