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 还可以给一个或多个类型起一个新名称(当变量用)

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区别相关推荐

  1. 【ts】typescript高阶:键值类型及type与interface区别

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 typescript高阶之键值类型及type与interface区别 前言 一.键值类型的语法 1.语法 2.错误例子 3.正确例子 ...

  2. TypeScript type 和 interface区别

    在使用ts的type 和 interface时 两者作用(简单案例) interface只能定义对象数据结构类型. // 简单案例1 interface User {name: string;age: ...

  3. TypeScript中type和interface区别

    typescript中interface介绍:TypeScript 中的接口 interface_疆~的博客-CSDN博客通常使用接口(Interface)来定义对象的类型.https://blog. ...

  4. Typescript 中的 interface 和 type 有什么区别?

    总结: type 后面有 =,interface 没有. type 可以描述任何类型组合,interface 只能描述对象结构. interface 可以继承自(extends)interface 或 ...

  5. TypeScript 中 Type 和 Interface 有什么区别?

    type 和 interface type 是 类型别名,给一些类型的组合起别名,这样能够更方便地在各个地方使用. 假设我们的业务中,id 可以为字符串或数字,那么我们可以定义这么一个名为 ID 的 ...

  6. type 与 interface 的区别,你真的懂了吗?

    大厂技术  高级前端  Node进阶 点击上方 程序员成长指北,关注公众号 回复1,加入高级Node交流群 在写 ts 相关代码的过程中,总能看到 interface 和 type 的身影.它们的作用 ...

  7. type 和 interface的区别

    类型别名(type)会给一个类型起个新名字. 类型别名有时和接口很像,但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型. 1.都可以描述一个对象或者函数 [interface] int ...

  8. type和interface的区别

    type和interface都可以用来表示接口,但实际用的时候会有写差异. 1.type和interface的相同点:都是用来定义对象或函数的形状. interface example {name: ...

  9. TS 中 type 和 interface 的区别

    类型别名(type)会给一个类型起个新名字.类型别名有时和接口很像,但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型. 1.都可以描述一个对象或者函数 [interface] inte ...

最新文章

  1. linux find 文件夹下查找字符串
  2. Golang的Int8 Int16 Int32 Int64区别
  3. Leetcode39.Combination Sum组合总和
  4. 质性研究工具_质性研究【001】
  5. python 角度传感器模拟_python树莓派红外反射传感器
  6. 沟通linux与windows的wine
  7. (转)Spring Boot 2 (九):【重磅】Spring Boot 2.1.0 权威发布
  8. 【写作技巧】本科毕业论文开题报告写作攻略
  9. 大前端主题添加强力推荐和联系我们模块
  10. 三角波fft的c语言程序设计,dsp的fft实现设计报告.docx
  11. 新闻平台聚合之新浪新闻爬虫发布
  12. android自定义拨号键盘,Android拨号键盘增加魔力爱心数字
  13. MyBatis系列之--Java 项目(非SpringBoot)集成MyBatis
  14. 方法重写的两同两小一大原则
  15. ORACLE 大批量插入数据
  16. 【ARXML专题】_14_提取Arxml中CAN Signal信号信息
  17. freescale S12X微控制器 模拟EEPROM 快速上手指南
  18. 混合波束成形| 高速铁路通信系统的信道估计:Location-Aided mMIMO Channel Tracking and Hybrid Beamforming for High-Speed
  19. ML:LGBMClassifier、XGBClassifier和CatBoostClassifier的feature_importances_计算方法源代码解读之详细攻略
  20. 网上书店管理系统mysql代码_网上书店管理系统数据库数据库

热门文章

  1. 一维条形码攻击技术(Badbarcode)
  2. “降频门”终结篇 你真的会因为续航给手机降频吗?
  3. resourcePatternResolver.getResources() 报错 *.xml cannot be opened beacuse is does not exist
  4. 梯度响应图——针对无纹理目标的检测
  5. 程序启动BOOT理解
  6. mac目的地址和源地址
  7. python计算阶梯电费_【Python】【demo实验6】【练习实例】【奖金发放计算(阶梯)】...
  8. rust月球服务器名字_Rust Tank加速器
  9. 小程序生态加持下,轻松构建超级App
  10. LSI-9260-8i阵列卡更换纪实