Typescript中interface和type的区别
通过分析interface和type的相同点和区别,对如何使用它们有更好的了解。
相同点
- 都可以用来描述对象或者函数。
- 都可以实现继承。
不同点
1. 写法
- interface定义对象和函数的写法
//定义对象
interface Person {
name:string;
age:number;
}
//定义函数
interface SetPerson {
(name:string,age:number): void;
}
- type定义对象和函数的写法
//定义对象
type Person = {
name:string;
age:number;
}
//定义函数
type SetPerson = (name:string,age:number): void;
2. 继承方式
- interface通过extends继承interface的类型
interface Person {
name:string;
age:number;
}
interface Student extends Person {
sex:string
}
- type通过&继承type的类型
type Person = {
name:string;
age:number;
}
type Student = Person & {
sex:string
}
- 两者定义的类型也可以互相继承
type Person = {
name:string;
age:number;
}
//interface 继承 type
interface Student extends Person {
sex:string
}
interface Person {
name:string;
age:number;
}
//type 继承 interface
type Student = Person & {
sex:string
}
3. type可以, interface不行
- type可以定义基本类型
type Name = string;
type Age = number;
- type可以声明联合类型
type Student = { name:string } | { setName(name:string):void }
- type声明元组类型
type Data = [string, number]
- type定义的类型别名不可重复,重复会报错
type Person = { name: string };
type Person = { age: number }; //Duplicate identifier 'Person'
4. type不行,interface可以
- interface可以联合声明
interface Person {
name:string;
}
interface Person {
age:number
}