在 TypeScript 中,接口是用于定义对象形状的强大工具。它们强制执行类型检查,确保您创建的对象遵循特定的结构。下面看一下常用接口的各种情况,并附有示例:
接口通常用于定义对象的结构。这确保了任何附着于该接口的对象都将具有特定的属性。
interface User { name: string; age: number; email: string; } const user: User = { name: "John Doe", age: 30, email: "[email protected]" };
接口允许您使用 ? 定义可选属性。象征。这意味着该对象可能具有也可能不具有这些属性。
interface Product { id: number; name: string; description?: string; // Optional property } const product: Product = { id: 1, name: "Laptop" };
您可以将属性定义为只读,这意味着它们在初始化后无法更改。
interface Config { readonly apiUrl: string; timeout: number; } const config: Config = { apiUrl: "https://api.example.com", timeout: 5000 }; // config.apiUrl = "https://newapi.example.com"; // Error: Cannot assign to 'apiUrl' because it is a read-only property.
接口可用于定义函数的形状,指定参数类型和返回类型。
interface Login { (username: string, password: string): boolean; } const login: Login = (username, password) => { return username === "admin" && password === "admin123"; }; console.log(login("admin", "admin123")); // true
接口可以扩展其他接口,允许通过组合现有的类型来创建复杂类型。
interface Person { name: string; age: number; } interface Employee extends Person { employeeId: number; department: string; } const employee: Employee = { name: "Alice", age: 28, employeeId: 12345, department: "Engineering" };
类可以实现接口,确保它们遵守接口的结构。
interface Animal { name: string; makeSound(): void; } class Dog implements Animal { name: string; constructor(name: string) { this.name = name; } makeSound() { console.log("Woof! Woof!"); } } const dog = new Dog("Buddy"); dog.makeSound(); // Woof! Woof!
接口可以描述具有特定类型动态键属性的对象。
interface StringArray { [index: number]: string; } const myArray: StringArray = ["Hello", "World"]; console.log(myArray[0]); // Hello
接口可以定义既充当函数又充当具有属性的对象的对象。
interface Counter { (start: number): void; interval: number; reset(): void; } const counter: Counter = (function (start: number) { console.log("Counter started at", start); } as Counter); counter.interval = 1000; counter.reset = () => { console.log("Counter reset"); }; counter(10); console.log(counter.interval); // 1000 counter.reset();
TypeScript 允许您合并同一接口的多个声明,这在处理大型代码库或库时非常有用。
interface Box { height: number; width: number; } interface Box { color: string; } const myBox: Box = { height: 20, width: 15, color: "blue" };
TypeScript 中的接口提供了一种灵活而强大的方式来定义和强制执行对象形状,从而实现强大的类型检查和清晰、可维护的代码。
免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。
Copyright© 2022 湘ICP备2022001581号-3