TypeScript中interface和type的差别是什么?

TypeScript中interface和type的差别是什么?

    • 1. interface
    • 2. type
    • 3. interface和type的差别
      • 3.1. 扩展性
      • 3.2. 声明合并
      • 3.3. 重新声明
      • 3.4. 类实现
      • 3.5. 基本类型别名

  在TypeScript中,interface和type都是定义类型的关键字,但它们在使用和行为上存在一些差异。理解这些差异对于在合适的场景中选择正确的抽象方式至关重要。

1. interface

  interface在TypeScript中主要用于定义对象的结构,它是一种方式来告诉编译器一个对象应该具有哪些形状。

interface Person {
  name: string;
  age: number;
}

const user: Person = {
  name: "Alice",
  age: 30
};

  在这个例子中,我们定义了一个Person接口,它要求实现的对象必须有两个属性:name(字符串类型)和age(数字类型)。

2. type

  type关键字用于定义更广泛的类型,不仅仅是对象结构。它可以用来给基本类型、联合类型、元组、函数等赋予一个新名字。

type PersonType = {
  name: string;
  age: number;
};

const user: PersonType = {
  name: "Alice",
  age: 30
};

  在这个例子中,我们使用type定义了一个PersonType类型别名,它与Person接口等效。

3. interface和type的差别

3.1. 扩展性

  • interface:可以被扩展(extends),允许多个接口合并到一个接口中。
  • type:没有扩展的概念,但可以使用交叉类型(&)来组合多个类型。

3.2. 声明合并

  • interface:当有两个相同的接口声明时,它们会合并。
  • type:相同的类型别名声明会导致编译错误。

3.3. 重新声明

  • interface:可以在不同的地方重复声明同一个接口,每次声明都会为接口添加额外的成员,这被称为声明合并。
  • type:重复的类型别名声明是不允许的。

3.4. 类实现

  • interface:类可以使用implements关键字来实现接口。
  • type:不能用于类的实现。
// 使用interface
interface Person {
  name: string;
}

interface Person {
  age: number; // 这会与上面的Person接口合并
}

class User implements Person {
  name: string;
  age: number;
}

// 使用type
type PersonType = {
  name: string;
};

// 下面的声明会导致错误,因为PersonType已经被声明过了
type PersonType = {
  age: number;
};

  在这个例子中,我们展示了如何使用interface和type来定义类型,并展示了声明合并和重新声明的差异。

3.5. 基本类型别名

  • interface:不能用于基本类型的别名声明。
  • type:可以用于基本类型、联合类型、元组、函数等的别名声明。
// 使用type定义基本类型的别名
type ID = string;

const id: ID = "123"; // 使用别名ID

// 使用type定义复杂的类型别名
type User = [string, number]; // 元组类型
type Callback = () => void; // 函数类型

  在这个例子中,我们使用type来定义基本类型、元组和函数的别名

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/567560.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

牛客网刷题 | BC60 判断是不是字母

描述 KiKi想判断输入的字符是不是字母,请帮他编程实现。 输入描述: 多组输入,每一行输入一个字符。 输出描述: 针对每组输入,输出单独占一行,判断输入字符是否为字母,输出内容详见输出样例…

加密、解密、签名、验签、数字证书、CA浅析

一、加密和解密 加密和解密应用的很广,主要作用就是防止数据或者明文被泄露。 加解密算法主要有两大类,对称加密和非对称加密。对称加密就是加密和解密的密钥都是一个,典型的有AES算法。非对称加密就是有公钥和私钥,公钥可以发布…

在线测径仪的六类测头组合形式!哪种适合你?

在线测径仪,这一现代工业的精密仪器,犹如一位技艺高超的工匠,以其卓越的性能和精准度,为工业生产提供了坚实的保障。它的出现,不仅提高了生产效率,更保证了产品质量,为企业的可持续发展注入了强…

1张图片+3090显卡微调Qwen-VL视觉语言大模型(仅做演示、效果还需加大数据量)

原项目地址:https://github.com/QwenLM/Qwen-VL/blob/master/README_CN.md 环境本地部署(见之前博文) 【本地部署 】23.08 阿里Qwen-VL:能对图片理解、定位物体、读取文字的视觉语言模型 (推理最低12G显存) 一、数据集格式说明 …

『视觉感官盛宴』3D线上商场全方位展示商品与互动购买体验

随着技术的进步和消费者需求的多样化,3D线上商场作为一种新兴的电子商务平台,正逐渐改变传统的在线购物模式。 一、商品展示革命 在3D线上商场中,商品展示不再局限于静态图片和文字描述。借助先进的3D建模技术,商家能够创建商…

从0到1带你玩转pandas

学习 pandas 的过程可以分为几个阶段,每个阶段都围绕着不同的核心技能和概念。下面是一个为初学者设计的学习大纲: 一. 基础介绍 学习如何安装和设置 pandas 以及了解它的基本概念是开始使用 pandas 进行数据分析的第一步。下面我将详细介绍这些步骤&am…

【MySQL】A01、性能优化-语句分析

1、数据库优化方向 A、SQL及索引优化 根据需求写出良好的SQL,并创建有效的索引,实现某一种需求可以多种写法,这时候我们就要选择一种效率最高的写法。这个时候就要了解sql优化 B、数据库表结构优化 根据数据库的范式,设计表结构&…

mac电脑搭建vue环境(上篇)

第一步:mac电脑要有homebrew,如何安装homebrew 点击下方 MAC安装homebrew-CSDN博客 第二步:homebrew安装node.js 第三步:安装npm 第四步:安装webpack 第五步:安装vue脚手架 第六步:可以在…

翻译《The Old New Thing》 - Some reasons not to do anything scary in your DllMain

Some reasons not to do anything scary in your DllMain - The Old New Thing (microsoft.com)https://devblogs.microsoft.com/oldnewthing/20040127-00/?p40873 Raymond Chen 2004年01月27日 简介 这篇文章讨论了为什么不应该在DLL的DllMain函数中执行复杂的操作 正文 众所…

Java中的重写

package day34; ​ public class Father {String name;int age;public void 输出(){System.out.println("father");} } ​ package day34; ​ public class Son extends Father{Overridepublic void 输出() {System.out.println("son");} } ​ package d…

C++:构造函数和析构函数

一、构造函数 1.1概念 构造函数是一个特殊的成员函数&#xff0c;名字与类相同&#xff0c;创建类类型对象时由编译器自动调用&#xff0c;保证每个数据成员都由一个合适的初始值。在对象的生命周期内只调用一次。 不使用构造函数 #include<iostream> using namespac…

美国站群服务器如何解决跨国运营中的网络延迟问题?

美国站群服务器如何解决跨国运营中的网络延迟问题? 在当今全球化的商业环境中&#xff0c;跨国企业面临的一个重要挑战是网络延迟问题。网络延迟不仅影响用户体验&#xff0c;还可能导致交易失败或数据传输错误&#xff0c;对企业造成不利影响。然而&#xff0c;利用美国站群…

982: 输出利用二叉树存储的普通树的度

解法&#xff1a; 由题意&#xff0c;根据二叉树求对应的合法普通树的度&#xff0c;度就是节点儿子数的最大值。 也就是左孩子&#xff0b;兄弟 在二叉树中就是某根节点的右孩子某根节点的右孩子的右孩子。。。 例AB#CD##E### 关于树概念不理解的可以看看981: 统计利用二叉…

【目标检测】YOLOv7 网络结构(与 YOLOv4,YOLOv5 对比)

YOLOv7 和 YOLOv4 Neck 与 Head 结构对比 其实 YOLOv7 的网络结构网上很多文章已经讲得很清除了&#xff0c;网络结构图也有非常多的版本可供选择&#xff0c;因为 YOLOv7 和 YOLOv4 是一个团队的作品&#xff0c;所以在网络结构方面&#xff0c; YOLOv7 和 YOLOv4 有很多相似…

解决配置Tomcat时,找不到war和war exploded问题

解决配置Tomcat时&#xff0c;找不到war和war exploded问题 文章目录 解决配置Tomcat时&#xff0c;找不到war和war exploded问题前言一、解决方法&#xff1a;1. war exploded2. war 总结 前言 提示&#xff1a;以下是本篇文章正文内容&#xff1a; 一、解决方法&#xff1a;…

mac电脑搭建vue项目(下篇)

第三步&#xff1a;安装npm &#xff08;1&#xff09;执行以下命令安装cnpm淘宝镜像 sudo npm install -g cnpm --registryhttps://registry.npmmirror.com &#xff08;2&#xff09;执行命令cnpm -v查看版本信息&#xff0c;结果说找不到cnpm命令 &#xff08;3&#xff…

【Ubuntu20.04+Noetic】UR5e+Gazebo+Moveit

环境准备 创建工作空间 mkdir -p ur5e_ws/src cd ur5e_ws/srcUR机械臂软件包 UR官方没更新最新的noetic的分支,因此安装melodic,并需要改动相关文件。 安装UR的模型配置包,包里面有UR模型文件,moveit配置等: cd ~/ur5e_ws/src git clone -b melodic-devel https://git…

分步搭建HF区块链网络

一.搭建网络规划 采用容器环境&#xff0c;搭建1个排序节点(Orderer)、2个对等节点(Peer)&#xff0c;另外用 一个fabric-cli容器。实训中的绝大部分命令是通过该容器执行的。 容器名称设置 二. 配置HF网络证书 首先docker ps 检查镜像&#xff0c;确保镜像为空 1.生成crypto…

新技术前沿-2024-国内主流AI大模型架构及应用场景深度分析

参考国内主流AI 大模型架构及应用场景深度分析 2024 1 厂商总览 1.1 国外 (1)Open AI:GPT-4【美国旧金山的人工智能研究公司】 GPT-4于2023年3月14日发布,是千亿级参数的多模态预训练模型,能够支持图像和文本的输入。 (2)Anthropic(人类的):Claude【美国人工智能初创公司…

供应链拉动与推动生产方式(供应链维度)

一、推式供应链与拉式供应链的定义 1、推动式供应链 推动式供应链是以制造商为核心企业&#xff0c;根据产品的生产和库存情况&#xff0c;有计划地把商品推销给客户&#xff0c;其驱动力源于供应链上游制造商的生产。在这种运作方式下&#xff0c;供应链上各节点比较松散&am…
最新文章