文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

Typescript中interface与type的相同点与不同点是什么

2023-07-04 16:33

关注

今天小编给大家分享一下Typescript中interface与type的相同点与不同点是什么的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。

interface VS type

大家使用 typescript 总会使用到 interface 和 type,官方规范 稍微说了下两者的区别

  • An interface can be named in an extends or implements clause, but a type alias for an object type literal cannot.

  • An interface can have multiple merged declarations, but a type alias for an object type literal cannot.

相同点

都可以描述一个对象或者函数

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;

都允许拓展(extends)

interface 和 type 都可以拓展,并且两者并不是相互独立的,也就是说 interface 可以 extends type, type 也可以 extends interface 。 虽然效果差不多,但是两者语法不同

interface extends interface

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

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

不同点

type 可以而 interface 不行

// 基本类型别名type Name = string// 联合类型interface Dog {    wong();}interface Cat {    miao();}type Pet = Dog | Cat// 具体定义数组每个位置的类型type PetList = [Dog, Pet]
// 当你想获取一个变量的类型时,使用 typeoflet 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 {  name: string  age: number}interface User {  sex: string}

以上就是“Typescript中interface与type的相同点与不同点是什么”这篇文章的所有内容,感谢各位的阅读!相信大家阅读完这篇文章都有很大的收获,小编每天都会为大家更新不同的知识,如果还想学习更多的知识,请关注编程网行业资讯频道。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     801人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     348人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     311人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     432人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     220人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯