TypeScript：interface（接口）和 type（类型别名）的区别

已于 2024-03-01 11:30:06 修改
阅读量195 收藏
点赞数 2
文章标签： typescript
于 2024-03-01 11:29:35 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45427648/article/details/136391246
版权

interface（接口）和 type（类型别名）的对比：

  • 相同点：都可以给对象指定类型。
  • 不同点：
    • 接口，只能为对象指定类型。
    • 类型别名，不仅可以为对象指定类型，实际上可以为任意类型指定别名
      在这里插入图片描述
程序员无羡
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Typescript 中的 interface 和 type 到底有什么区别详解
10-16
在TypeScript中，`interface`和`type`都是用来做类型定义的，它们有相似之处，但也有明显的差异。理解这些区别对于编写高质量的TypeScript代码至关重要。 首先，`interface`和`type`都能用于描述对象类型。例如，...
typescript基础知识：接口与类型别名
imagine_tion的博客
07-12 1285
一、接口（interface） 在以往的面向对象语言中，例如Java，接口是一个很重要的概念，它是对行为的抽象，而具体如何行动需要由类去实现。 TypeScript 中的接口是一个非常灵活的概念，除了可用于对类的一部分行为进行抽象以外，也常用于对「对象的形状（Shape）」进行描述。 1.对象的形状 interface Person { name: string; age: number; } let alan: Person = { name: "alan", age: 18, }; .
接口 vs 类型别名
前端精髓
03-29 657
类型别名 类型别名会给一个类型起个新名字。 类型别名有时和接口很像，但是可以作用于原始值，联合类型，元组以及其它任何你需要手写的类型。 type Name = string; type NameResolver = () => string; type NameOrResolver = Name | NameResolver; function getName(n: NameOrResolver): Name { if (typeof n === 'string') { ret
TS中类型别名和接口区别
qq_42931285的博客
10-28 429
TS中类型别名和接口区别
ts：类型别名type以及和接口interface的区别
分享前端开发工程师的一些日常生活、前端知识点、职业发展、对一些问题的看法、感悟等等
08-12 2648
类型别名type 类型别名会给一个类型起个新名字。 类型别名有时和接口很像，但是可以作用于原始值，联合类型，元组以及其它任何你需要手写的类型。 type Name = string; type NameResolver = () => string; type NameOrResolver = Name | NameResolver; function getName(n: NameOrResolver): Name { if (typeof n === 'string') {
Typescript中 interface 和 type 的差别是什么？
qq_50294652的博客
08-16 849
TypeScript中interface和type的差别
udemy--typescript-union-literal-type-alias-interface-void.:好的
03-31
在TypeScript中，标题"udemy--typescript-union-literal-type-alias-interface-void"所涉及的核心概念包括联合类型(Union Types)、字面量类型(Literal Types)、类型别名(Type Aliases)以及接口(Interfaces)和空类型...
common-types:用于TypeScript项目的可重用的通用类型库
03-31
@ skypilot / common-types TypeScript项目的可重用通用类型库出口产品便利别名type AnyRecord = Record < string>// Describes an object without propertiestype EmptyObject = { [ key : string ] : never ;...
typescript-definition-style-guide：用于将类型定义添加到我的npm包中的样式指南
02-06
- 函数参数、变量和接口的属性都需要类型注解，以明确它们的预期类型。 - 这有助于编译器在早期阶段发现类型错误。 7. **默认导出（Default Exports）**： - 如果一个模块只有一个主要的公共接口或类，可以使用...
Tackling.TypeScript.2020.6.pdf
04-08
- **接口**：使用`interface`关键字定义对象的形状。 - **类型**：使用`type`关键字定义对象类型。 #### 7.14 泛型与类型变量 - **泛型**：使用尖括号`<>`表示类型参数。 - **类型变量**：通过类型参数实现对类型的...
type 与 interface 的区别，你真的懂了吗？
程序员成长指北
03-03 2784
大厂技术高级前端Node进阶点击上方程序员成长指北，关注公众号回复1，加入高级Node交流群在写 ts 相关代码的过程中，总能看到 interface 和 type 的身影。它们...
不要再混淆TypeScript的类型别名和接口了
文本魔术
12-27 869
如果你在简历上写过TypeScript，那么面试官可能会问你类型别名和接口的区别是什么。你知道怎么回答这个问题吗? 如果你不知道，读完这篇文章后你可能就会明白了。
TypeScript --- interface接口详解
D-的博客
11-17 6301
TypeScript/TS 接口和类型别名type详解区别
ts中type 与 interface 的区别
xia_tian666的博客
09-01 3697
ts中type 与 interface 的区别
在TypeScript中，类型别名（Type Aliases）和接口（Interfaces）的区别
最新发布
msl1119的博客
05-15 406
示例：
三分钟了解interface和type
热门推荐
秋来九月八
01-14 1万+
对typescript 有一定了解的,会发现 interface 和 type 很相似,类型定义上，很多时候，用两种方式都能实现。 三分钟直入主题， 除了语法不同外，interface和type主要有区别 1 类型别名可以用于其它类型 （联合类型、元组类型、基本类型（原始值）），interface不支持 type PartialPointX = { x: number }; type PartialPointY = { y: number }; // union(联合) type PartialPoint
TS中的接口（interface）与类型别名(type alias)
qq_42760049的博客
09-09 4200
TS中的接口（interface）与类型别名(type alias) 定义 在 typescript 中, 我们声明类型有两种方式： 接口(interface) 和类型别名(type alias)，官方文档对于两者及其异同的描述如下： One of TypeScript’s core principles is that type checking focuses on the shape that values have. This is sometimes called “duck typing” o
ts type interface 区别_详解typescript中接口interface和类型别名type的用法区别
weixin_39839018的博客
11-25 3916
最近本文作者在用typescript开发代码时发现接口interface和类型别名type用法很像，这篇文章我们就来聊聊这两个用法的异同点。异同点图1从图1中我们发现接口interface和类型别名type在定义一个普通的对象类型时没啥区别，泛型都能照常用。如果我们定义一个简单类型呢？图2如图2所示，像这样的简单类型的定义，type用起来就很随意，但是interface恐怕就无法做到了。图3如图3...
ts - 接口（interface）和类型别名（type）的区别
qq_44277696的博客
03-09 947
接口/类型别名的扩展（继承） 接口（interface）使用extends关键字 interface Animal { name: string } interface Bear extends Animal{ honey: boolean } const bear: Bear = { name: "winie", honey: true } console.log(bear.name); console.log(bear.honey); 类型别名（type）使用&符
TypeScript 接口和类型别名
06-02
TypeScript 中的接口和类型别名都可用于定义类型，但在一些情况下，它们有不同的使用场景。 接口用于描述对象的形状，可以用来定义对象的属性、方法和方法的参数类型。例如： ```typescript interface Person { name: string; age: number; sayHello: () => void; } const person: Person = { name: 'Tom', age: 18, sayHello() { console.log(`Hello, my name is ${this.name}`); } }; ``` 类型别名用于给一个类型定义一个新的名字，可以用来定义基本类型、联合类型、交叉类型等。例如： ```typescript type Age = number; type Name = string; type Person = { name: Name; age: Age; }; const person: Person = { name: 'Tom', age: 18, }; ``` 需要注意的是，接口和类型别名都可以用于描述函数类型： ```typescript interface Add { (a: number, b: number): number; } type Sub = (a: number, b: number) => number; const add: Add = (a, b) => a + b; const sub: Sub = (a, b) => a - b; ``` 但是，接口和类型别名在描述函数类型时有所不同。接口可以描述函数的可选参数、默认参数和剩余参数，而类型别名则不能。例如： ```typescript interface Func { (a: number, b?: number, ...rest: number[]): void; } type FuncAlias = (a: number, b?: number, ...rest: number[]) => void; const func: Func = (a, b, ...rest) => { console.log(a, b, rest); }; const funcAlias: FuncAlias = (a, b, ...rest) => { console.log(a, b, rest); }; ``` 因此，在需要描述函数类型时，建议优先使用接口。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序员无羡

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值