TypeScript 中的 extends 關鍵字就像一把瑞士軍刀。它可用於多種上下文,包括繼承、泛型和條件類型。了解如何有效地使用擴充功能可以產生更健壯、可重複使用且類型安全的程式碼。
extends 的主要用途之一是繼承,允許您建立基於現有介面或類別的新介面或類別。
interface User { firstName: string; lastName: string; email: string; } interface StaffUser extends User { roles: string[]; department: string; } const regularUser: User = { firstName: "John", lastName: "Doe", email: "john@example.com" }; const staffMember: StaffUser = { firstName: "Jane", lastName: "Smith", email: "jane@company.com", roles: ["Manager", "Developer"], department: "Engineering" };
在此範例中,StaffUser 擴充了 User,繼承了其所有屬性並新增了新屬性。這使我們能夠基於更通用的類型來建立更具體的類型。
extends 關鍵字也用於類別繼承:
class Animal { constructor(public name: string) {} makeSound(): void { console.log("Some generic animal sound"); } } class Dog extends Animal { constructor(name: string, public breed: string) { super(name); } makeSound(): void { console.log("Woof! Woof!"); } fetch(): void { console.log(`${this.name} is fetching the ball!`); } } const myDog = new Dog("Buddy", "Golden Retriever"); myDog.makeSound(); // Output: Woof! Woof! myDog.fetch(); // Output: Buddy is fetching the ball!
這裡,Dog 擴展了 Animal,繼承了它的屬性和方法,同時也加入了它自己的屬性和方法。
extends 關鍵字在使用泛型時至關重要,它允許我們限制可與泛型函數或類別一起使用的類型。
interface Printable { print(): void; } function printObject<T extends Printable>(obj: T) { obj.print(); } class Book implements Printable { print() { console.log("Printing a book."); } } class Magazine implements Printable { print() { console.log("Printing a magazine."); } } const myBook = new Book(); const myMagazine = new Magazine(); printObject(myBook); // Output: Printing a book. printObject(myMagazine); // Output: Printing a magazine. // printObject(42); // Error, number doesn't have a 'print' method
總之,函數 printObject
T extends U ? X : Y
type ExtractNumber<T> = T extends number ? T : never; type NumberOrNever = ExtractNumber<number>; // number type StringOrNever = ExtractNumber<string>; // never
這裡,ExtractNumber 類型採用型別參數 T。條件類型檢查 T 是否擴展了數字類型。如果是,則類型解析為 T(這是數字類型)。如果不存在,則類型解析為 never。
現在,讓我們考慮表達式 A |乙| C 擴充了 A。乍看之下這似乎違反直覺,但在 TypeScript 中,這個條件實際上是錯誤的。原因如下:
type Fruit = "apple" | "banana" | "cherry"; type CitrusFruit = "lemon" | "orange"; type IsCitrus<T> = T extends CitrusFruit ? true : false; type Test1 = IsCitrus<"lemon">; // true type Test2 = IsCitrus<"apple">; // false type Test3 = IsCitrus<Fruit>; // false
在此範例中,IsCitrus
以上是掌握 TypeScript:了解擴充的力量的詳細內容。更多資訊請關注PHP中文網其他相關文章!