昨天我們知道可以使用 keyof
的方式取出物件屬性 key,那麼如果我們是想要取出物件型別中屬性值的型別呢?
例如,有一個物件型別 Person
長這樣:
type Person = {
firsName: string;
lastName: string;
age: number;
isEmployed: boolean;
};
假設我們想要取出 Person 物件型別中 age
的型別時,方式很簡單,可以像 JavaScript 使用 bracket syntax 來取出物件屬性值的方法一樣,像是這樣:
// 建立一個新的名稱為 AgeOfPerson 的型別
// 它的型別會是 Person 物件屬性 "age" 值的型別
type AgeOfPerson = Person["age"];
如此就可以得到它 AgeOfPerson
的型別會是 number
:
而這種透過 Object 的 Index 來取得其型別的方式,就稱作是 Indexed Access Type:
如果想要取得的不只是 age
的屬性值型別,還想同時取出 isEmployed
的屬性型別值的話,同樣的可以搭配使用 union type:
type AgeAndIsEmployedOfPerson = Person['age' | 'isEmployed'];
可以得到 AgeAndIsEmployedOfPerson
的型別就會是 number | boolean
:
那麽如果想要取出的是該物件型別中的「所有屬性值的型別」的話可以怎麼做呢?
從上一個段落可以看到,在 []
中以 union type 帶入多個 key 的話,就可以取出不只一個物件屬性值的型別,現在如果想要取得的是所有物件型別的屬性值,是不是只需要把物件型別的所有 key 先組成 union type 後,再代入 []
就可以了呢?
這裡的關鍵字是「把物件型別的所有 key 先組成 union type」。這不就是昨天的內容嗎?
也就是說,使用昨天提到的 keyof Person
,就可以取得所有物件型別的 key,並組成 union type,接著只要把它帶入 []
內:
結果就和我們預期的一樣,ValuesOfPerson
會是 Person
這個物件型別的所有屬性值所組出來的 union type,也就是 string | number | boolean
:
因此,當你未來有需要取得所有物件型別中的屬性值時,記得使用 keyof operator + indexed access types 的組合技。