定义接口
在TypeScript中,interface是一个强有力的概念,它用于定义类型签名,特别是对象的结构。接口可以用来描述对象应该有哪些属性、方法,以及这些成员的类型。它们是实现类型系统中“鸭子类型”(duck typing)的关键,这意味着如果一个对象“看起来像鸭子,走起路来像鸭子”,那么就可以认为它是一只鸭子——即如果一个对象满足某种结构,那么就可以用作那种结构的对象。
interface Person { name: string; age: number; greet: (greeting: string) => void;
} let person: Person = { name: "Alice", age: 30, greet: function(greeting: string) { console.log(greeting + ", " + this.name); }
}; person.greet("Hello"); // 输出: Hello, Alice
在这个例子中,Person接口定义了三个成员:两个属性name和age,以及一个方法greet。实现(或说“符合”)这个接口的对象必须包含这三个成员。
可选属性
interface的可选属性是一个非常有用的特性,它允许你在定义接口时指定某些属性不是必须存在的。可选属性可以让你的接口更加灵活,适用于多种不同的应用场景,尤其是在处理可能缺少某些属性的对象时。
interface Person {name: string;age?: number; // 可选属性address?: string; // 可选属性
}
使用可选属性
alice 没有任何可选属性,bob 有 age 属性,而 charlie 则包含了所有的属性。
const alice: Person = {name: "Alice"
};const bob: Person = {name: "Bob",age: 30
};const charlie: Person = {name: "Charlie",age: 25,address: "123 Elm Street"
};
访问可选属性
当你访问一个可能不存在的可选属性时,TypeScript 会认为该属性可能为 undefined。这意味着你必须处理这种可能性,要么使用可空联合类型,要么使用可选链操作符(?.)
alice.age; // 编译器警告:可能为 undefined
alice.age = 22; // 错误:不能给可选属性赋值,除非已经确定它存在if (alice.age) {console.log(`Alice is ${alice.age} years old.`);
}// 或者使用可选链操作符(?.)
console.log(alice?.age); // 如果 alice.age 不存在,则输出 undefined 而不是抛出错误
只读属性
在TypeScript中,interface
的只读属性(read-only properties)是一种特殊类型的属性,它限制了属性在初始化后不能被再次赋值。只读属性在定义时使用readonly
关键字进行标记,这可以确保对象的某些部分在创建后保持不变,从而有助于维护数据的完整性。
基本用法
定义只读属性的基本语法是在属性名称前加上readonly
关键字:
interface Point {readonly x: number;readonly y: number;
}const point: Point = { x: 10, y: 20 };
point.x = 5; // Error: Cannot assign to 'x' because it is a read-only property.
在这个例子中,Point
接口定义了两个只读属性x
和y
。当你尝试修改这些属性的值时,TypeScript编译器会报错,因为这些属性被声明为只读。
初始化只读属性
只读属性必须在创建对象时被初始化,或者在声明时给出默认值。如果在接口或类中声明只读属性而没有给出初始值,那么它必须在构造函数中初始化。
class Circle {readonly radius: number;constructor(radius: number) {this.radius = radius;}
}const circle = new Circle(5);
// circle.radius = 10; // Error: Cannot assign to 'radius' because it is a read-only property.
只读数组
readonly
关键字也可以应用于数组类型,创建一个只读数组。只读数组不允许添加、删除或修改元素。
let numbers: readonly number[] = [1, 2, 3];
numbers.push(4); // Error: Property 'push' does not exist on type 'readonly number[]'.
numbers.pop(); // Error: Property 'pop' does not exist on type 'readonly number[]'.
只读索引签名
你甚至可以在索引签名中使用readonly
关键字,这样就可以创建一个只读的索引类型。
interface ReadonlyDictionary<T> {readonly [key: string]: T;
}const dictionary: ReadonlyDictionary<string> = { key: "value" };
dictionary.key = "new value"; // Error: Cannot assign to 'key' because it is a read-only or constant property.
只读属性的使用场景
只读属性在以下场景中特别有用:
- 当你希望某些数据在对象创建后保持不变时,比如配置或常量。
- 当你想要保证数据的不可变性,以提高程序的并发安全性。
- 当你想要防止不小心修改数据,尤其是在复杂的代码库中,这有助于避免潜在的bug。
额外属性
在TypeScript中,接口(interface
)的额外属性检查(Excess Property Checking)是一种类型检查机制,它确保对象没有包含接口定义中不存在的额外属性。这有助于保持代码的健壮性和一致性,避免因无意中向对象添加不必要的属性而导致的潜在问题。
额外属性检查的规则
当一个对象被赋值给一个期望特定接口类型的变量或参数时,TypeScript编译器会检查对象是否包含接口中定义的所有必需属性,并且不允许对象包含任何额外的属性,除非这些属性被明确地允许。
默认情况下不允许额外的属性
假设我们有一个简单的接口定义:
interface SquareConfig {color?: string;width?: number;
}
如果我们尝试将一个具有额外属性的对象赋值给期望SquareConfig
类型的变量,TypeScript将发出错误:
let config: SquareConfig = {color: "blue",width: 100,extra: true // 错误: Object literal may only specify known properties, and 'extra' does not exist in type 'SquareConfig'.
};
允许额外的属性
要允许对象具有超出接口定义的额外属性,可以使用索引签名或者使用特殊的never
类型来覆盖默认的检查行为。
使用索引签名
通过在接口中添加一个索引签名,你可以指定额外属性的类型:
interface SquareConfig {color?: string;width?: number;[propName: string]: any; // 允许任何额外属性
}
使用never
类型
另一种方法是在接口中定义一个返回never
类型的索引签名,然后在使用该接口的地方添加一个额外的类型,该类型允许额外的属性:
interface SquareConfig {color?: string;width?: number;[propName: string]: never; // 默认情况下禁止额外属性
}function createSquare(config: SquareConfig): { color: string; area: number } {// ...
}// 使用类型断言来允许额外属性
const configWithExtraProps: SquareConfig & { extra: boolean } = {color: "blue",width: 100,extra: true
};createSquare(configWithExtraProps); // 不会报错
函数类型接口
接口(interface)不仅可以用来定义对象的形状,包括它们应该拥有的属性和方法,还可以用来定义函数类型。通过接口来描述函数类型,可以确保函数具有预期的参数类型和返回类型,从而提高代码的健壮性和可维护性。
基本的函数类型接口
当你想要定义一个函数类型时,可以在接口中直接描述该函数的参数和返回值的类型。函数类型的接口通常不包含属性,而是直接包含一个或多个函数签名。
interface SearchFunc {(source: string, subString: string): boolean;
}// 使用函数类型接口
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string): boolean {return source.search(subString) !== -1;
};// 或者使用箭头函数
mySearch = (source: string, subString: string): boolean => {return source.includes(subString);
};// 直接赋值给变量时,TypeScript 可以自动推断类型,但接口提供了显式声明
let anotherSearch: SearchFunc = (src, sub) => src.includes(sub);
在这个例子中,SearchFunc
接口定义了一个函数类型,该函数接受两个字符串参数source
和subString
,并返回一个布尔值。任何符合这个签名的函数都可以被赋值给mySearch
变量。
可索引的类型
接口(interface
)的可索引类型(Indexed Types)允许你定义对象的索引签名,这些索引签名描述了当使用索引(如数组索引或对象的键)访问对象时,应该返回什么类型的值。这种类型定义对于数组、字典(对象字面量作为映射)或其他类似的集合非常有用。
基本语法
可索引类型通过[key: Type]: ValueType;
的形式来定义,其中key
是索引的类型(如number
或string
),ValueType
是当访问索引时返回值的类型。
数组类型
虽然你通常不会直接为数组类型定义一个接口(因为TypeScript已经内置了数组类型),但了解可索引类型如何与数组类似的结构一起工作是有帮助的。
interface NumberArray {[index: number]: number;
}let myArray: NumberArray = [1, 2, 3];
// 正确,因为数组的每个元素都是数字// myArray = ['a', 2, 3]; // 错误,因为数组中有非数字元素
注意:在实际应用中,你通常会直接使用number[]
或Array<number>
来表示数字数组,而不是定义一个具有可索引签名的接口。
字符串索引的映射
对于对象(通常用作字典或映射),你可以使用字符串作为索引的类型。
interface StringMap {[key: string]: any; // 注意:这里使用any作为示例,但在实际应用中,最好指定更具体的类型
}let myMap: StringMap = {'name': 'Alice','age': 30,'city': 'New York'
};// 访问和设置值
console.log(myMap['name']); // 输出: Alice
myMap['country'] = 'USA';
类类型
在TypeScript中,接口(interface
)的类类型(Class Types)并不是指接口本身直接定义了一个类,而是指接口可以被用来描述一个类的实例应该具有哪些属性和方法。这种描述方式允许你定义一种契约(contract),任何实现了这个契约的类(即其实例符合接口定义的类)都可以被当作该接口类型的实例来使用。
基本用法
当你使用接口来描述一个类类型时,你实际上是在定义该类的实例必须遵守的形状(shape)。这意味着类的实例必须包含接口中声明的所有属性和方法。
interface Point {x: number;y: number;moveTo(x: number, y: number): void;
}class SomePoint implements Point {x: number;y: number;constructor(x: number, y: number) {this.x = x;this.y = y;}moveTo(x: number, y: number): void {this.x = x;this.y = y;}
}let point: Point = new SomePoint(1, 2);
point.moveTo(3, 4);
在这个例子中,Point
接口定义了一个点应该具有x
和y
两个属性,以及一个moveTo
方法。SomePoint
类通过实现Point
接口,明确表明其实例将具有这些属性和方法。因此,SomePoint
的实例可以被赋值给Point
类型的变量。
类的静态部分和实例部分
需要注意的是,接口只能描述类的实例部分,即类的属性和方法(不包括构造函数)的形状。接口不能描述类的静态部分,即那些直接附加到类本身而不是其实例上的属性和方法。
如果你需要描述一个包含静态成员的类的形状,你可能需要使用类型别名(Type Aliases)配合typeof
关键字来创建一个类型,该类型描述了类的静态部分。但是,这通常不是通过接口来实现的。
类的构造函数
虽然接口不能直接描述类的构造函数,但你可以通过定义一个包含构造函数签名的接口来间接地描述它。然而,这种方法并不常见,因为TypeScript通常通过类本身或类型别名来处理构造函数类型。
不过,你可以使用接口来定义一个构造函数签名,并通过实现该接口的类来间接地实现这个构造函数签名。但是,这通常是通过在类上定义一个静态方法来模拟的,因为TypeScript不允许直接通过接口来强制实现特定的构造函数。
泛型接口与类
接口还可以与泛型一起使用,以定义能够工作于多种类型上的类的形状。这使得接口更加灵活和强大。
interface GenericIdentityFn<T> {(arg: T): T;
}function identity<T>(arg: T): T {return arg;
}let myIdentity: GenericIdentityFn<number> = identity;
在这个例子中,GenericIdentityFn
是一个泛型接口,它描述了一个接受一个类型参数T
的函数,该函数接受一个T
类型的参数并返回相同类型的值。然后,我们定义了一个泛型函数identity
,它实现了GenericIdentityFn
接口(对于任何类型T
)。最后,我们创建了一个GenericIdentityFn<number>
类型的变量myIdentity
,并将其初始化为identity
函数的一个实例(这里我们隐式地指定了T
为number
)。
接口的继承
在TypeScript中,interface
支持继承,这是一种非常强大的特性,它允许你创建新的interface
,这些interface
会继承现有interface
的属性和方法。继承在interface
中的工作方式与类的继承相似,但有一些关键的不同点,尤其是interface
可以多重继承,而类不可以。
继承单一interface
你可以从一个interface
继承来扩展或覆盖已有的类型定义。假设你有两个interface
,一个描述了一个简单的Shape
,另一个描述了一个更具体的Rectangle
:
interface Shape {color: string;
}interface Rectangle extends Shape {width: number;height: number;
}let rect: Rectangle = { color: "blue", width: 10, height: 5 };
在这个例子中,Rectangle
interface
从Shape
interface
继承了color
属性,并添加了自己的width
和height
属性。
多重继承
interface
的一个强大特性是它们可以继承多个interface
。这意味着你可以组合多个不同特性的interface
到一个新的interface
中:
interface Labelled {label: string;
}interface Sized {size: number;
}interface LabelledSized extends Labelled, Sized {// 新的接口包含label和size属性
}let box: LabelledSized = { label: "Box", size: 100 };
添加新成员
在继承interface
时,你可以添加新的成员,也可以覆盖已有的成员,但不能改变成员的类型签名。例如,你不能在继承的interface
中改变一个方法的参数列表或返回类型。
interface Printable {print(): void;
}interface EnhancedPrintable extends Printable {print(format: string): void; // 错误:不能改变已有成员的类型签名
}
正确的做法是添加一个重载,或者创建一个新方法:
interface EnhancedPrintable extends Printable {print(format?: string): void;
}
与类的交互
interface
可以被类实现(implements
),这样类就必须提供interface
中所有成员的实现。同样,interface
可以继承自类的公共成员,但不能继承其实现细节:
class Base {public baseMethod(): void {// ...}
}interface DerivedFromBase extends Base {derivedMethod(): void;
}class DerivedClass implements DerivedFromBase {baseMethod(): void {// 实现baseMethod}derivedMethod(): void {// 实现derivedMethod}
}
在上面的例子中,DerivedFromBase
interface
继承了Base
类的baseMethod
方法签名,然后DerivedClass
实现了这两个方法。
接口继承类
在TypeScript中,接口(Interface)继承类(Class)的概念并不是直接的继承关系,而是指接口可以“借用”类的公共成员(属性和方法)来扩展自身的定义。这在TypeScript中被称为“从类中提取接口”,或者说是“从类中继承接口”。
从类中继承接口
当你想从一个类中提取公共的成员定义到接口中,以便其他类可以共享这些成员的签名,你可以创建一个接口并使用类名作为接口定义的一部分。TypeScript会自动分析类的公共成员并将它们添加到接口中。注意,只有类的公共(public
)、受保护(protected
)和声明的(declare
)成员会被包含在接口中。
示例:
假设你有一个如下的类:
class BaseClass {public prop: string;protected method(): void {// 方法实现}
}
你可以在另一个文件或同一文件中定义一个接口,该接口将“继承”或“借用”BaseClass
的公共和受保护成员:
interface DerivedFromBaseClass extends BaseClass {}
现在,DerivedFromBaseClass
接口将包含prop
属性和method
方法的签名。然后,你可以使用这个接口来定义新的类,这些类将自动拥有BaseClass
的公共和受保护成员的签名:
class NewClass implements DerivedFromBaseClass {prop: string;method(): void {// 实现方法}
}
注意点
-
实现与继承的区别:
- 当一个类实现一个接口时,它必须提供接口中所有成员的具体实现。
- 类的继承关系中,子类可以继承父类的实现,而不仅仅是签名。
-
成员访问修饰符:
- 接口中的成员默认是公共的,即使在类中它们可能是受保护的或私有的。
- 如果类中的成员是私有的(
private
),它们不会被包含在从类中提取的接口中。
-
静态成员:
- 类的静态成员不会被包含在从类中提取的接口中,因为接口主要用于描述对象的结构,而静态成员不属于对象实例。
-
构造函数:
- 类的构造函数不会被包含在从类中提取的接口中,因为接口不能描述构造函数签名。