首页 > 其他分享 >typescript 中type和interface的区别

typescript 中type和interface的区别

时间:2024-09-01 13:25:37浏览次数:13  
标签:typescript 定义 name 类型 interface type string

在 TypeScript 中,typeinterface 都是用来定义类型别名的工具,但它们之间有一些细微的区别。了解这些区别有助于更好地选择何时使用哪一个。

相同点

  • 类型定义:两者都可以用来定义对象的形状(shape),即指定一个对象应该具有哪些属性、方法及其类型。
  • 可选属性:都可以定义可选属性。
  • 扩展:都可以实现继承和组合的功能。

不同点

1. 语法糖 vs 类型系统的一部分
  • interface 是 TypeScript 类型系统的一部分,它更像是面向对象编程语言中的接口概念。它可以模拟继承机制,允许一个接口继承另一个接口。
  • type 则更像是语法糖,它提供了更灵活的方式来定义类型别名,可以将复杂的类型表达式赋值给一个名字。
2. 扩展能力
  • interface 可以被扩展(extend)和合并(merge)。如果你定义了两个相同名称的接口,TypeScript 会自动合并它们。

    interface Animal {
      name: string;
    }
    
    interface Animal {
      age: number;
    }
    
    // 实际上相当于
    interface Animal {
      name: string;
      age: number;
    }
    
  • type 不能被合并,每个 type 声明都会覆盖之前的同名声明。

    type Animal = { name: string };
    
    type Animal = { age: number };  // 这里实际上是覆盖了之前的定义
    
3. 使用场景
  • interface 更适合定义公共的、可能需要被扩展的对象类型。例如,定义 API 接口、组件的属性等。
  • type 更适合定义具体的类型别名,尤其是那些包含联合类型(union types)、交叉类型(intersection types)等复杂类型的场合。此外,type 也适合定义基本类型别名。
4. 枚举类型
  • interface 不能用于定义枚举类型。
  • type 可以用来定义枚举类型的别名,尽管这不是它的主要用途。

示例

使用 interface
interface Person {
  name: string;
  age?: number; // 可选属性
}

// 继承
interface Developer extends Person {
  language: string;
}
使用 type
type Person = {
  name: string;
  age?: number; // 可选属性
};

// 使用联合类型
type Developer = Person & {
  language: string;
};

总的来说,选择 interface 还是 type 取决于具体的使用场景和个人喜好。在大多数情况下,两者可以互换使用,但是在需要合并类型定义或者使用面向对象风格的类型定义时,interface 更加合适。而在需要定义复杂的类型别名时,type 更具优势。

标签:typescript,定义,name,类型,interface,type,string
From: https://blog.csdn.net/ivan5277/article/details/141783203

相关文章

  • Comprehensive Diagnostic Capabilities The Perkins EST Interface 2024A with WiFi
     Intoday'sfast-pacedworld,havingtherighttoolscanmakeallthedifference,especiallywhenitcomestomaintainingandservicingengines.ThePerkinsEST(ElectronicServiceTool)Interface2024AwithWiFiisacutting-edgediagnostictoolde......
  • 【Android】根据URI获取文件扩展名或MimeType
    关于安卓中的URI安卓中的URI包含多种格式,可以是文件,可以是媒体库资源,可以是Resource也可以是网络地址,或其它资源标识这里我们主要针对文件来源的URI安卓中通过URI访问文件主要包括三种方式文件路径媒体库资源(背后仍然是文件,但无法直接访问)Resource资源对于这三种不同......
  • g++链接报错:undefined reference to typeinfo of xxx
    g++链接报错:undefinedreferencetotypeinfoofxxx问题背景在项目中遇到了这样一个问题:C++文件编译都OK,但链接的时候报错:undefinedreferencetotypeinfoforxxx。std::typeinfo是C++中的RTTI(RunTimeTypeIdentification)机制中记录类型信息用的,dynamic_cast和typeid......
  • 快充协议方案 TYPE-C口取电支持PD5V、 9V、 12V、 15V、 20V
    Type-C口的充电器,一般是PD协议的充电器,例如华为65W,iPhone20W,小米45W充电器等等,这种充电器具有电压范围广,电流大,充电速度快等特点,一个充电器可以支持多种设备使用的优点。PD充电器的电压一般有5V、9V、12V、15V、20V,所有可以满足手机,ipad、平板和笔记本电脑使用,但是,这种充电器......
  • [JS] ArrayBuffer、DataView和TypedArray
    JavaScript中数组元素的数据类型是不固定的,number类型可以是整数也可以是浮点数。这种性质与其它常见语言中的定型数组很不一样,导致不同语言编写的程序在交换数据的时候,需要花费很多时间在数据转换上。ECMAScript后来引入了定型数组TypedArray。TypedArray并不是一个实际存在......
  • 训练yolov5时出现报错:AttributeError: ‘FreeTypeFont‘ object has no attribute ‘g
    报错:Traceback(mostrecentcalllast):File"D:\anaconda3_xz\envs\luopytorch\lib\threading.py",line932,in_bootstrap_innerself.run()File"D:\anaconda3_xz\envs\luopytorch\lib\threading.py",line870,inrunself._target(*s......
  • 在Vue3应用中使用TypeScript的最佳实践
    随着Vue3的推出,TypeScript逐渐成为了前端开发中的一种必备技能。Vue3的设计更好地支持TypeScript,这使得开发者可以在开发过程中充分利用TypeScript的强类型系统,从而提高代码的可维护性和可读性。在这篇博客中,我们将深入探讨在Vue3应用中使用TypeScript的最佳实践,并通过示例......
  • firewalld: 接口interface操作
    一,查看zone和interface的关系1,查看活动区域:[root@blog~]#firewall-cmd--get-active-zonesdropsources:11.20.12.18publicinterfaces:eth0trustedsources:13.27.13.15可以看到public这个zone绑定了eth0这个interface2,查询一个interface绑定的zone[root@blo......
  • 地平线—征程2(Journey 2-J2)芯片详解(28)—MIPI RX/TX+SD/SDIO/eMMC Interface Timings
    写在前面本系列文章主要讲解地平线征程2(Journey2-J2)芯片的相关知识,希望能帮助更多的同学认识和了解征程2(Journey2-J2)芯片。若有相关问题,欢迎评论沟通,共同进步。(*^▽^*)错过其他章节的同学可以电梯直达目录↓↓↓地平线—征程2(Journey2-J2)芯片详解——目录-CSDN博客1......
  • 地平线—征程2(Journey 2-J2)芯片详解(29)—BIFSD+BIFSPI+QSPI Interface Timing
    写在前面本系列文章主要讲解地平线征程2(Journey2-J2)芯片的相关知识,希望能帮助更多的同学认识和了解征程2(Journey2-J2)芯片。若有相关问题,欢迎评论沟通,共同进步。(*^▽^*)错过其他章节的同学可以电梯直达目录↓↓↓地平线—征程2(Journey2-J2)芯片详解——目录-CSDN博客1......