当前位置: 首页 > news >正文

TypeScript 基础学习笔记:interface 与 type 的异同

在这里插入图片描述

🔥 个人主页:空白诗

在这里插入图片描述

文章目录

  • TypeScript 学习笔记:`interface` 与 `type` 的异同
    • 🎣 引言
    • 🚀 快速入门
      • 1️⃣ Interface(接口)
        • 📋 定义
        • 🤝 实现
        • 💡 特点
      • 2️⃣ Type Aliases(类型别名)
        • 📜 定义
        • 🎯 应用
        • 🧠 特点
    • 📊 `interface` 与 `type` 的区别
    • 🌟 实践建议
    • 🚀 总结

在这里插入图片描述


TypeScript 学习笔记:interfacetype 的异同

🎣 引言

TypeScript的世界里,精准的类型定义是保证代码质量与团队协作效率的关键。interfacetype 作为两种核心的类型定义工具,它们各自承载着不同的设计意图与应用场景。本文旨在清晰阐述两者的基本概念、应用场景及核心差异,帮助开发者在实际编码过程中做出更为合适的选择,进一步提升代码的健壮性和可维护性。

🚀 快速入门

TypeScript 中,类型系统是为了增强 JavaScript类型安全interfacetype 都是创建自定义类型的手段,但它们各自有着独特的应用场景和特点。

1️⃣ Interface(接口)

📋 定义

interface 用于描述对象的形状(shape),即一组必须遵循的属性和方法的集合。它可以用于类的实现、函数参数的类型约束,甚至是变量的类型注解。

interface Person {name: string;age: number;greet(): void; // 描述一个方法
}
🤝 实现

类可以实现一个接口,强制类具有接口规定的属性和方法。

class Student implements Person {name: string;age: number;constructor(name: string, age: number) {this.name = name;this.age = age;}greet(): void {console.log(`Hello, I'm ${this.name} and I'm ${this.age} years old.`);}
}
💡 特点
  • 可扩展性:接口可以合并(通过重复声明接口名并添加新成员),实现接口的类或接口可以逐渐积累成员。
  • 面向对象友好:更适合面向对象编程中的抽象定义。

2️⃣ Type Aliases(类型别名)

📜 定义

type 关键字用于创建一个新的名字来引用现有的类型,它可以是原始类型、联合类型、元组类型、甚至其他接口类型。

type StringOrNumber = string | number;
type Point = [number, number];
type Admin = { role: 'admin'; permissions: string[] 
};
🎯 应用
  • 简单替换:简化复杂的类型表达式。
  • 联合类型:定义可以是多种类型的变量。
  • 接口兼容性替代:尽管 type 不能被继承,但可以用来定义对象类型,类似于 interface
🧠 特点
  • 灵活性type 更灵活,可以定义函数类型、元组、联合类型等。
  • 不可扩展:与接口相比,类型别名一旦定义,就不能像接口那样通过合并来扩展。
  • 互斥性:不能用 implements 关键字实现 type,适合非面向对象的场景。

📊 interfacetype 的区别

  • 扩展性interface 支持后续扩展,而 type 不支持。
  • 用途interface 适用于定义对象形状,尤其是面向对象设计;type 更通用,适用于各种类型定义,包括但不限于对象类型。
  • 语法差异interface 可以直接定义方法签名,而 type 定义对象类型时需使用对象字面量形式。

🌟 实践建议

  • 对于需要描述对象结构或实现多态的场景,优先考虑使用 interface
  • 当需要定义复杂的类型组合或函数类型时,使用 type 可能更加简洁和灵活。
  • 根据具体需求和团队编码规范来决定使用哪个,两者并非互斥,经常需要配合使用以达到最佳效果。

🚀 总结

综上所述,interfacetype 都是TypeScript中实现类型安全的重要机制,它们各有千秋,服务于不同的场景需求。

interface凭借其开放性和面向对象的特性,非常适合用于定义和扩展对象结构及类的契约;而type则以其灵活性和多样性,在处理联合类型、元组类型及更复杂的类型定义时展现出独特优势。

开发者应当根据具体的项目需求和代码风格,合理选择使用interfacetype,或是两者结合,以达到最优的类型系统设计。理解它们之间的差异与联系,是每位TypeScript开发者技能提升的重要一环。

相关文章:

TypeScript 基础学习笔记:interface 与 type 的异同

🔥 个人主页:空白诗 文章目录 TypeScript 学习笔记:interface 与 type 的异同🎣 引言🚀 快速入门1️⃣ Interface(接口)📋 定义🤝 实现💡 特点 2️⃣ Type Al…...

【管理咨询宝藏95】SRM采购平台建设内部培训方案

本报告首发于公号“管理咨询宝藏”,如需阅读完整版报告内容,请查阅公号“管理咨询宝藏”。 【管理咨询宝藏95】SRM采购平台建设内部培训方案 【格式】PDF版本 【关键词】SRM采购、制造型企业转型、数字化转型 【核心观点】 - 重点是建设一个适应战略采…...

第七届机电、机器人与自动化国际会议(ICMRA 2024)即将召开!

第七届机电、机器人与自动化国际会议(ICMRA 2024)将于2024年9月20日-22日在中国武汉举行。ICMRA 2024为各国专家学者提供一个学术交流的平台,讨论机电、机器人和自动化领域的最新研究成果和未来的研究方向,旨在能够建立起国家间&a…...

【智能楼宇秘籍】一网关多协议无缝对接BACnet+OPC+MQTT

在繁华的都市中心,一座崭新的大型商业综合体拔地而起,集购物、餐饮、娱乐、办公于一体,是现代城市生活的缩影。然而,这座综合体的幕后英雄——一套高度集成的楼宇自动化系统,正是依靠多功能协议网关,实现了…...

leetCode68. 文本左右对齐

基本思路&#xff1a; leetCode68. 文本左右对齐 代码 class Solution { public:vector<string> fullJustify(vector<string>& words, int maxWidth) {vector<string> res;for(int i 0; i < words.size(); i){ // 枚举有多少个单词int j i 1; //…...

搜狗输入法 PC端 v14.4.0.9307 去广告绿化版.

软件介绍 搜狗拼音输入法作为众多用户计算机配置的必备工具&#xff0c;其功能的全面性已为众所周知&#xff0c;并且以其高效便捷的输入体验受到广大使用者的青睐。然而&#xff0c;该软件在提供便利的同时&#xff0c;其内置的广告元素常常为用户带来一定的干扰。为此&#…...

【汇总】虚拟机网络不通(Xshell无法连接虚拟机)排查方法

搜索关键字关键字关键字&#xff1a;虚拟机虚拟机虚拟机连接失败、虚拟机无法连接、Xshell连接失败、ping baidu.com失败、静态IP设置 Kali、CentOS、远程连接 描述&#xff1a;物理机无法连接虚拟机&#xff1b;虚拟机无法访问百度&#xff0c;虚拟机无法访问baidu.com 虚拟机…...

C++开发基础之函数参数传递的几种类型

一、前言 在C中&#xff0c;接口指针或类对象的函数参数传递是一个常见的做法&#xff0c;特别是在需要支持多态或动态绑定时。这里将介绍如何传递接口指针或类对象作为函数参数。 二、函数参数传递的几种类型 抽象类&#xff08;接口&#xff09;的实例只能通过指针或引用传…...

使用memcache 和 redis 、 实现session 会话复制和保持

一、NoSQL介绍 NoSQL是对Not Only SQL、非传统关系型数据库的统称 NoSQL一词诞生于1998年&#xff0c;2009年这个词汇再次提出指非关系型、分布式、不提供ACID的数据库设计模式 随着互联网时代的数据爆发时增长、数据库技术发展的日新月异&#xff0c;要适应新的业务需求&am…...

Tomcat 优化

在目前流行的互联网架构中&#xff0c;Tomcat在目前的网络编程中是举足轻重的&#xff0c;由于Tomcat的运行依赖于JVM&#xff0c;从虚拟机的角度把Tomcat的调整分为外部环境调优 JVM 和 Tomcat 自身调优两部分。 一、JVM组成 1. JVM 组成 JVM组成部分 类加载子系统: 使用Ja…...

如何将pdf文件换成3d模型?---模大狮模型网

PDF文件是一种广泛用于文档传输和共享的格式&#xff0c;但在某些情况下&#xff0c;我们可能希望将其中的内容转换为更具交互性和视觉效果的3D模型。本文将介绍如何将PDF文件转换为3D模型&#xff0c;为您展示实现这一想象的步骤。 选择合适的PDF文件&#xff1a; 首先&#…...

Docker 中快速构建 Redis Cluster 集群

Docker 中快速构建 Redis Cluster 集群 目录 前言环境准备 所需软件配置网络 构建 Redis Cluster 镜像 创建自定义 Dockerfile构建镜像 启动 Redis 节点容器 启动命令 配置 Redis Cluster 集群 创建 Redis 集群验证集群状态 总结 前言 Redis 是一个高性能的键值对数据库&am…...

C语言----杨辉三角

各位看官们好。学习到这里想必大家应该对C语言的了解也是很深刻的了吧。但是我们也不能忘记我们一起学习的知识啊。在我们以前学习C语言的时候我想大家应该都听说过杨辉三角吧。虽然我们把其中的规律找到那么这个代码就简单很多了。那么接下里我们就来讲讲杨辉三角。 首先我们先…...

FlaUI

FlaUI是一个基于微软UIAutomation技术&#xff08;简称UIA&#xff09;的.NET库&#xff0c;它主要用于对Windows应用程序&#xff08;如Win32、WinForms、WPF、Store Apps等&#xff09;进行自动化UI测试。FlaUI的前身是TestStack.White&#xff0c;由Roemer开发&#xff0c;旨…...

MySQL调优-01反范式化表设计

MySQL调优-01反范式化表设计 数据库设计三范式 第一范式&#xff08;1NF&#xff09;。确保数据库表的每一列都是不可分割的原子数据项&#xff0c;即列中不可包含数组、记录等非原子数据项&#xff1b;确保表中没有重复的属性或列&#xff0c;每个属性只出现一次&#xff0c;…...

74从零开始学Java之排序算法中的冒泡和选择排序

作者:孙玉昌,昵称【一一哥】,另外【壹壹哥】也是我哦 CSDN博客专家、万粉博主、阿里云专家博主、掘金优质作者 前言 我们要想成为一个优秀的程序员,其实非常关键的一点就是要锻炼培养自己的编程思维,就好比一个狙击手,要通过大量的射击训练要用大量的子弹喂出来。同样的…...

【Qt问题】VS2019 Qt win32项目如何添加x64编译方式

往期回顾&#xff1a; 【Qt问题】Qt常用快捷键汇总-CSDN博客 【Qt问题】Qt Creator 如何链接第三方库-CSDN博客 【Qt问题】Qt 如何带参数启动外部进程-CSDN博客 【Qt问题】VS2019 Qt win32项目如何添加x64编译方式 我们都知道vs2019在编译项目的时候是需要选择编译环境的&…...

LabVIEW换智能仿真三相电能表研制

LabVIEW换智能仿真三相电能表研制 在当前电力工业飞速发展的背景下&#xff0c;确保电能计量的准确性与公正性变得尤为重要。本文提出了一种基于LabVIEW和单片机技术&#xff0c;具有灵活状态切换功能的智能仿真三相电能表&#xff0c;旨在通过技术创新提高电能计量人员的培训…...

Python | Leetcode Python题解之第69题x的平方根

题目&#xff1a; 题解&#xff1a; class Solution:def mySqrt(self, x: int) -> int:if x 0:return 0C, x0 float(x), float(x)while True:xi 0.5 * (x0 C / x0)if abs(x0 - xi) < 1e-7:breakx0 xireturn int(x0)...

libhv http client vs cpr

libhv http client 和 cpr 的性能对比 libhv test code static void test_http_async(HttpClient* cli, int seq, int* resp_cnt) {auto req std::make_shared<HttpRequest>();req->method HTTP_GET;req->url "www.baidu.com";req->timeout 1…...

CTFHub-Web-文件上传

CTFHub-Web-文件上传-WP 一、无验证 1.编写一段PHP木马脚本 2.将编写好的木马进行上传 3.显示上传成功了 4.使用文件上传工具进行尝试 5.连接成功进入文件管理 6.上翻目录找到flag文件 7.打开文件查看flag 二、前端验证 1.制作payload进行上传发现不允许这种类型的文件上传 …...

笔记2:cifar10数据集获取及pytorch批量处理

&#xff08;1&#xff09;cifar10数据集预处理 CIFAR-10是一个广泛使用的图像数据集&#xff0c;它由10个类别的共60000张32x32彩色图像组成&#xff0c;每个类别有6000张图像。 CIFAR-10官网 以下为CIFAR-10数据集data_batch_*表示训练集数据&#xff0c;test_batch表示测试…...

FSD自动驾驶泛谈

特斯拉的FSD&#xff08;Full-Self Driving&#xff0c;全自动驾驶&#xff09;系统是特斯拉公司研发的一套完全自动驾驶系统。旨在最终实现车辆在多种驾驶环境下无需人类干预的自动驾驶能力。以下是对FSD系统的详细探讨&#xff1a; 系统概述 FSD是特斯拉的自动驾驶技术&…...

golang获取变量动态类型

类型断言&#xff1a;data.(Type) 类型断言是最常用的获取变量动态类型的方法之一。允许在运行时将接口值转换为其具体类型。 data 是一个接口类型的变量。 Type 是一个具体的类型。 这个表达式的含义是&#xff0c;如果 data 的底层值是 Type 类型&#xff0c;那么 value 将接…...

外企接受大龄程序员吗?

本人知乎账号同公众号&#xff1a;老胡聊Java&#xff0c;欢迎留言并咨询 亲身体会外企经历所见所闻&#xff0c;外企能接受大龄程序员。 1 大概是10年的时候&#xff0c;进一家知名外企&#xff0c;和我一起进的一位manager&#xff0c;后来听下来&#xff0c;年龄35&#xf…...

【DevOps】掌控云端:Google Cloud SDK 快速上手

一、Google Cloud SDK Google Cloud SDK (Software Development Kit) 是一组工具,包括 gcloud、gsutil 和 bq,用于通过命令行或自动化脚本访问和管理 Google Cloud 资源和服务。以下是 Cloud SDK 的详细介绍: 1、gcloud 命令行工具 gcloud 是 Cloud SDK 的核心组件,用于管理 …...

【Unity 踩坑系列】配置VScode环境Downloading the.NET Runtime Failed to download.NET 7.0.9installation timed out

1.问题描述 在最近使用Unity配置VScode开发环境时&#xff0c;总会出现以下的情况。(很多朋友其实本地已经自己安装好了.net环境 PS:可能各种版本.net 6.0 - .net 8.0都试过安装了 但就是会自动下载最新版本的.net ) Downloading the .NET Runtime. Downloading .NET versio…...

深入了解 NumPy:深度学习中的数学运算利器

文章目录 1. 导入NumPy2. 创建NumPy数组3. 数组的算术运算4. N维数组4.1 创建和操作多维数组4.2 高维数组 5. NumPy的广播功能5.1 基本广播示例5.2 更复杂的广播示例 6. 访问数组元素6.1 基于索引的访问6.2 遍历数组6.3 基于条件的访问6.4 高级索引6.5 性能考虑 在深度学习和数…...

鸿蒙开发接口Ability框架:【@ohos.ability.particleAbility (particleAbility模块)】

particleAbility模块 particleAbility模块提供了Service类型Ability的能力&#xff0c;包括启动、停止指定的particleAbility&#xff0c;获取dataAbilityHelper&#xff0c;连接、断开当前Ability与指定ServiceAbility等。 说明&#xff1a; 本模块首批接口从API version 7开…...

Flutter笔记:Widgets Easier组件库(8)使用图片

Flutter笔记 Widgets Easier组件库&#xff08;8&#xff09;&#xff1a;使用图片 - 文章信息 - Author: 李俊才 (jcLee95) Visit me at CSDN: https://jclee95.blog.csdn.netMy WebSite&#xff1a;http://thispage.tech/Email: 291148484163.com. Shenzhen ChinaAddress o…...

手机做网站公司有哪些/百度在线识图

计算机二级考试《Java》代码的基本知识Java语言程序设计是计算机二级考试中的科目之一&#xff0c;是一种可以撰写跨平台应用程序的面向对象的程序设计语言。下面百分网小编为大家搜索整理了关于《Java》代码的基本知识&#xff0c;欢迎参考学习&#xff0c;希望对大家有所帮助…...

北京 房地产 网站建设/sem推广竞价

jdk7及以前&#xff1a; 通过-XX:PermSize 来设置永久代初始分配空间&#xff0c;默认值是20.75m -XX:MaxPermSize来设定永久代最大可分配空间&#xff0c;32位是64m&#xff0c;64位是82m jdk8及之后&#xff1a; 通过-XX:MetaspaceSize 来设置永久代初始分配空间&#xff…...

外贸网站建设浩森宇特/灰色广告投放平台

映射 | MAP 集合的映射操作是将来在编写Spark/Flink用得最多的操作&#xff0c;是我们必须要掌握的。因为进行数据计算的时候&#xff0c;就是一个将一种数据类型转换为另外一种数据类型的过程。 map方法接收一个函数&#xff0c;将这个函数应用到每一个元素&#xff0c;返回一…...

动态网站和静态网站区别/b站视频推广的方法有哪些

原文 拉兹万 预览开关 Razvan一直在查看-previewnosharedaccess报告的问题,但只从atila那里找到了少数几个.表明或有个没有很多错误的良好实现,或它没有大量使用它.阿蒂拉认为没人用它. Razvan指出,atila报告的一个错误是试实例化共享类会导致错误. 如果不工作,则有其他问题…...

做pc端网站平台/百度seo优化是做什么的

成熟又有钱的是父亲&#xff0c;成熟又没钱的是舅舅&#xff0c;不成熟有没钱的是儿子&#xff0c;看来自己只能做个儿子了。...

延吉做网站/常见的网络营销方式有哪几种

输出浮点数自动忽略后面多余0的方法 很多小伙伴在使用%f来输出浮点数时&#xff0c;后面会跟着多余的0&#xff0c;有的题目会要求自动省略后面的0&#xff0c;下面就来提供一种方法来自动省略浮点数后多余的0的方法。 我们可以使用%g来输出浮点数。看下面这段代码&#xff1a…...