持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第8天，点击查看活动详情
1. 引言
今天，我们来介绍下载TypeScript类型定义系统中常见的两种定义类型的方式，分别是interface（接口）和type（类型别名）
2. 含义
相同点： 都可以描述一个对象或者函数,type 描述时需要赋值操作，interface则不需要（请看例子一），都允许拓展：但是方式不同interface使用extends 而type使用交叉类型，并且两者并不是互相独立的，也就是说interface可以extends type, type也可以extends interface. 虽然效果差不多，但是语法不同（请看例子二）
不同点： ①type 重复定义相同名称类型会报错，而interface不会报错，还能够声明合并的。（请看例子三）②type可以声明基本类型别名、联合类型、元祖等类型；而interface只定义对象类型（请看例子四）
3. 作用
type声明的方式可以定义组合类型，交叉类型和原始类型 虽然接口可以被扩展和合并，但它们不能以联合和交集的形式组合在一起。类型可以使用联合和交集操作符来形成新的类型。
4. 例子
例子一：
interface User {
age: number,
name: string
}
interface SetUser {
(name: string,age: number): void
}
type User2 = {
age: number,
name: string
}
type SetUser2 = {
(name: string,age: number): void
}
例子二：
// interface 的方式
interface UserName {
name: string;
}
interface UserInfo extends UserName {
age: number;
}
// type 的方式
type UserName = {
name: string;
}
type UserInfo = UserName & { age: number }
// 两种混合模式
①interface extends type
type Name = {
name: string;
}
interface User extends Name {
age: number;
}
②type extends interface
interface Name {
name: string;
}
type User = Name & {
age: number;
}
例子三：
interface User {
name: string
age: number
}
interface User {
sex: string
}
// 最后 User类型为{name: string,age: number,sex: string}
例子四：
type Name = string;
// 联合类型
interface Dog {
wong()
}
interface Cat {
miao();
}
type Pet = Dog | Cat;
type PetList = [Dog, Pet];
例子五：
type StringOrNumber = string | number;
type Text = string | { text: string };
type NameLookup = Dictionary<string, Person>;
type Callback<T> = (data: T) => void;
type Pair<T> = [T, T];
type Coordinates = Pair<number>;
type Tree<T> = T | { left: Tree<T>, right: Tree<T> };
5. 总结
一般来说定义接口返回值，数据提交值等场景对象类型场景时候用interface；定义基本类型别名、联合类型、元祖等类型，自定义对象方法时候使用type；
