ts type interface 区别_实践TypeScript——TypeScript中Interface与Type的区别

4378804b334c4ec69a0a06645bc8b1e0

概念

接口(Interface)

接口主要用于类型检查,它只是一个结构契约,定义了具有相似的名称和类型的对象结构。除此之外,接口还可以定义方法和事件。

类型别名(Type Alias)

不同于interface只能定义对象类型,type声明还可以定义基础类型、联合类型或交叉类型。

差异点

1. 定义类型范围

interface只能定义对象类型。

而type声明可以声明任何类型,包括基础类型、联合类型或交叉类型。

  • 基本类型
type person = string
  • 联合类型
interface Dog { name: string;}interface Cat { age: number;}type animal = Dog | Cat
  • 元祖
interface Dog { name: string;}interface Cat { age: number;}type animal = [Dog, Cat]

2. 扩展性

接口可以extends、implements,从而扩展多个接口或类。类型没有扩展功能。

  • interface extends interface
interface Person {name: string}interface User extends Person {age: number}
  • interface extends type
type Person = {name: string}interface User extends Person {age: number}

但是type可以使用交叉类型&,来使成员类型合并

  • type & type
type Person = {name: string}type User = Person & { age: number }
  • type & interface
interface Person {name: string}type User = {age: number} & Person

3. 合并声明

定义两个相同名称的接口会合并声明。

定义两个同名的type会出现异常。

interface Person { name: string}interface Person { age: number}// 合并为:interface Person { name: string age: number} 

4. typeof

type可以使用typeof获取实例类型

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

分享文章

eede36ffda774946a52a3fa7252a436b
da318d7c92e24aab928f1120f674de41

链接文章

https://github.com/staven630/blog/blob/master/%E5%AE%9E%E8%B7%B5TypeScript/%E5%AE%9E%E8%B7%B5TypeScript%E2%80%94%E2%80%94TypeScript%E4%B8%ADInterface%E4%B8%8EType%E7%9A%84%E5%8C%BA%E5%88%AB.md

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值