TypeScript type 和 interface区别
在使用ts的type 和 interface时
两者作用(简单案例)
interface只能定义对象数据结构类型。
// 简单案例1
interface User {name: string;age: number;sex?: string;
}let user: User = {name: '',age: 233
};// 简单案例2
interface User1<T> {name: string;age: number;sex?: string;details?: T;
}const userObj: User1<{hobby: string;
}> = {name: '',age: 233,details: {hobby: '爱好吃饭',}
};
type侧重于直接定义类型
type 可用于 string、number、bool、undefined、null，而 interface 只能描述对象（含数组、函数、包装对象、元组）
type 还可以给一个或多个类型起一个新名称(当变量用)
type Demo = string | number; // 赋值
let test1: Demo = 1;
let test2: Demo = '';
type当然也能定义对象类型
type Demo = {[propname: string]: any
};type Demo<T> = {[propname: string]: T;
};type 和 interface 相同点
相同1：type 和 interface都支持扩展
// type 扩展
type myObj = {name: string;
}
// &符号
type myObjPlus = myObj & { age: number };const newObj: myObjPlus = {name: '',age: 233
};// interface 扩展
interface myObj {name: string;
};// extends继承扩展
interface myObjPlus extends myObj {age: number;
};const newObj: myObjPlus = {name: '',age: 233
};
// 当然两者都支持互相交叉扩展
// 情况1
type myObj = {name: string;
};interface myObjPlus extends myObj {age: number;
};const newObj: myObjPlus = {name: '',age: 233
};
// 情况2
interface user {age: number;
};
type myUser = {name: string;
} & user;
const newObj: myUser = {name: '',age: 233
};
type 和 interface 不同点
区别1: type 可以为基本类型，联合类型 或 元组 甚至any等等 赋值定义别名,interface 明显办不到
type A = string;
type B = string | unknown;
type C = B | [ 1, 2 ,3 ,4]; // 赋值当变量用
let test: C = '';
区别2: interface 定义重名了会合并属性，type 办不到(会报错提醒 重复定义)
// interface 定义重名了会合并属性,很多库ts源码里面都用到过类似方法作为扩展
interface A {name: string;
}interface A {age: number;
}const aObj: A = {name: '', // 必须age: 233 // 必须
};
使用场景
type 的一般使用场景
- 一般定义基本或联合类型
- 一般定义元组类型
- 一般定义函数类型
- 定义映射类型
interface 的使用场景
- 需要interface 重名会自动合并属性扩展的
- 定义对象数据结构(不使用type时)
总结
除了使用场景区别，type 声明的算是类型别名，而 interface 声明的是一个新类型。
(PS:其实自己确实可以想怎么定义就怎么定义，但为了标准化 最好还是得规范点)
TypeScript type 和 interface区别相关推荐
- 【ts】typescript高阶：键值类型及type与interface区别
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 typescript高阶之键值类型及type与interface区别 前言 一.键值类型的语法 1.语法 2.错误例子 3.正确例子 ...
- TypeScript中type和interface区别
typescript中interface介绍:TypeScript 中的接口 interface_疆~的博客-CSDN博客通常使用接口(Interface)来定义对象的类型.https://blog. ...
- type 和 interface区别
interface只能定义对象数据结构类型. // 简单案例1 interface User {name: string;age: number;sex?: string; }let user: Us ...
- Typescript 中的 interface 和 type 有什么区别？
总结: type 后面有 =,interface 没有. type 可以描述任何类型组合,interface 只能描述对象结构. interface 可以继承自(extends)interface 或 ...
- TypeScript 中 Type 和 Interface 有什么区别？
type 和 interface type 是 类型别名,给一些类型的组合起别名,这样能够更方便地在各个地方使用. 假设我们的业务中,id 可以为字符串或数字,那么我们可以定义这么一个名为 ID 的 ...
- TypeScript中的interface、type、class——泰联病从口入
先看效果 type 和 interface 有什么异同? 1.interface侧重于描述数据结构,type侧重于描述类型 interface A{name:string; } type B = 'b ...
- type 与 interface 的区别，你真的懂了吗？
大厂技术 高级前端 Node进阶 点击上方 程序员成长指北,关注公众号 回复1,加入高级Node交流群 在写 ts 相关代码的过程中,总能看到 interface 和 type 的身影.它们的作用 ...
- type 和 interface的区别
类型别名(type)会给一个类型起个新名字. 类型别名有时和接口很像,但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型. 1.都可以描述一个对象或者函数 [interface] int ...
- type和interface的区别
type和interface都可以用来表示接口,但实际用的时候会有写差异. 1.type和interface的相同点:都是用来定义对象或函数的形状. interface example {name: ...
最新文章
- Oracle 11G RAC：生产环境下架构
- 鲜为人知的DC-DC外围电感选型方法
- 携程基于Quasar协程的NIO实践
- Unity3d高频率面试题目（选择题）
- undolog 是binlog_mysql日志redo log、undo log、binlog以及作用看这篇就可以啦
- 【链接】Eclipse中快速打开文件所在的文件夹位置
- java季度第一天_Java得到年在一个季度的错误的第一天
- C#设计模式--工厂方法模式
- fckeditor代码总结
- 全局变量反汇编与重定位
- 用Python学《微积分B》（Fourier级数）
- 怎么样去图片水印？用这三招快速消除水印
- 《房地产证》与《房屋所有权证》或《房产证》有什么区别
- 【IOS开发高级系列】异步绘制专题
- vue3全局变量定义使用
- Deepfake版阿汤哥，在海外版抖音上收获了32万粉丝
- 2016全球与中国市场示波器深度研究报告
- win7系统更改计算机用户名和密码错误,win7系统一开机就显示用户名和密码错误故障的解决方法...
- docker build
- 6轴机器人运动学正解,逆解2