TypeScript中interface和type的区别

TypeScript中定义类型的两种方式

• 1、接口（interface）：只能约束对象类型
• 2、类型别名（type alias）：以声明的方式来定义组合类型，交叉类型，原始类型

相同点

• 1、都可以约束一个对象或者函数

// interface
interface User{
    name: string
    age: number
}
interface SetUser{
    (name: string, age: number):void
}
//type
type User = {
    name: string
    age: number
}
type SetUser = (name: string, age: number):void

• 2、都允许扩展（extends） interface和type都可以拓展，并且两者并不是互相独立的，也就是说interface可以extends type, type也可以extends interface. 虽然效果差不多，但是语法不同。

// interface extends interface
interface Name{
    name: string
}

interface Users extends Name{
    age: number
}

// type extends type， type继承type用&
type Name = {name: string}
type User = Name & {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}

不同点

• 1、 type声明基本类型别名、联合类型、元祖等类型

// 基本类型别名
type Name = string;

// 联合类型
interface Dog {
    wong()
}
interface Cat {
    miao();
}

type Pet = Dog | Cat;

// 具体定义数组每个位置的类型
type PetList = [Dog, Pet];

• 2、 type语句中还可以使用typeof获取实例的类型进行赋值

// 当你想要获取一个变量的类型时，使用typeof
let div = document.createElement('div');
type B = typeof div;

• 3、interface能够声明合并

interface User {
    name: string;
    age: number;
}

interface User {
    sex: string;
}
// User接口为：
{
    name: string;
    age: number;
    sex: string;
}