TypeScript 的型別系統很強大,大部分專案都在用。此外,在 TypeScript 中,其實有提供一些 Utility Types 來輔助我們進行型別定義與操作。今天與您分享其中五個。
Pick utility type 是從現有型別中選取某些屬性來生成新的型別。
基本上,Pick 從指定型別中刪除除指定鍵之外的所有鍵。
type Person = {
name: string
lastName: string
age: number
hobbies: string
}
type SomePerson = Pick<Person, "name" | "age">
// type SomePerson = {
// name: string;
// age: number;
// }
Omit utili type 與 Pick 型別相反,Omit 是寫出要省略的屬性,而不是要保留的屬性。
type Person = {
name: string
lastName: string
age: number
hobbies: string
}
type SomePerson = Omit<Person, "lastName" | "hobbies">
// type SomePerson = {
// name: string;
// age: number;
// }
Readonly utility type 用於所有屬性都設置成唯讀的型別。無法為屬性分配新值,不然就跳 TypeScript 警告。
type Person = {
name: string
}
type ReadOnlyPerson = Readonly<Person>
const person: ReadOnlyPerson = {
name: "Fizz",
}
person.name = "Buzz"
// Cannot assign to 'name' because it is a read-only property.
Partial utility type 用於所有屬性都設置為選填的型別。
type Person = {
name: string
lastName: string
age: number
address: string
}
type PartialPerson = Partial<Person>
// type PartialPerson = {
// name?: string | undefined;
// lastName?: string | undefined;
// age?: number | undefined;
// address?: string | undefined;
// }
Required utility type 與 Partial 相反。要求要定義好所有屬性。可用來避免選填屬性出現在此型別中。
type Person = {
name?: string
lastName?: string
age?: number
address?: string
}
type RequiredPerson = Required<Person>
// type RequiredPerson = {
// name: string;
// lastName: string;
// age: number;
// address: string;
// }
以上,簡單舉例五個分享,有很多好用的 utility type,歡迎查看官網了解更多:
https://www.typescriptlang.org/docs/handbook/utility-types.html