标签：string 区别 age number extends interface type

type 和 interface的区别

一咻 世界都变了   3 人赞同了该文章  

相同点

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）与交叉类型(intersection types)

1. interface 可以 extends，type 不允许 extends和implement的，type可以通过交叉类型实现 interface 的extends行为。
2. 并且两者并不是相互独立的，也就是说 interface 可以 extends type ， type也可以与 interface类型交叉。
3. 两者效果差不多，但是两者语法不同。

interface extends interface

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

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 & interface

interface Name {
    name: string
}

type User = Name & {
    age: number
}

不同点

type 可以 interface 不行

type 可以声明基本类别名，联合类型，元组类型

type Name = string
interface Dog {
  wong();
}
interface Cat {
  miao();
}

type Pet = Dog | Cat;

let a: Pet = {
  wong() {},
};

通过typeof获取实例的类型进行赋值

let div = document.createElement('div')
type B = typeof div

其他骚操作

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> };

interface 可以 type不行

interface 能够声明合并

interface User{
    nage: string,
    age: number,
}
interface User{
    sex: string
}

let user: User = {
    nage: '小明',
    age: 10,
    sex: '男'
}

推荐：能用interface就用interface，实现不了再考虑用type

发布于 2022-01-05 18:49

标签：string,区别,age,number,extends,interface,type
来源： https://www.cnblogs.com/sexintercourse/p/16613563.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。