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

【TypeScript】类型推论和类型别名

类型推断

TypeScript 的类型推断是一种编译器能够自动分析代码并确定变量的类型的功能。它允许你在声明变量时省略类型注释,让 TypeScript 根据变量的值来推断出合适的类型。

以下是 TypeScript 类型推断的一些示例和情况:

  1. 基本类型推断:
let age = 25; // TypeScript 推断 age 为 number 类型
let name = "Alice"; // TypeScript 推断 name 为 string 类型
let isStudent = true; // TypeScript 推断 isStudent 为 boolean 类型
  1. 数组类型推断:
let fruits = ['apple', 'banana', 'orange']; // TypeScript 推断 fruits 为 string[] 类型
  1. 函数类型推断:
function add(a: number, b: number) {return a + b;
}// TypeScript 推断 add 函数的类型为 (a: number, b: number) => number
  1. 对象属性类型推断:
let person = {name: 'Bob',age: 30
};// TypeScript 推断 person 为 { name: string, age: number } 类型
  1. 联合类型推断:
let value: number | string = 42; // TypeScript 推断 value 为 number 类型
value = 'forty-two'; // TypeScript 推断 value 为 string 类型
  1. 函数返回类型推断:
function greet(name: string) {return `Hello, ${name}!`;
}// TypeScript 推断 greet 函数的返回类型为 string

类型别名

在 TypeScript 中,类型别名(Type Alias)是一种用于为现有类型定义一个新的名称的机制。

以下是 TypeScript 类型别名的基本用法和特点:

// 基本类型的类型别名
type Age = number;
type Name = string;let age: Age = 25;
let name: Name = 'Alice';// 复杂类型的类型别名
type Person = {name: string;age: number;
};let person: Person = {name: 'Bob',age: 30
};// 联合类型的类型别名
type Result = number | string;let result1: Result = 42;
let result2: Result = 'forty-two';// 函数类型的类型别名
type Greeter = (name: string) => string;const greet: Greeter = (name) => `Hello, ${name}!`;// 联合类型和交叉类型的类型别名
type Combined = Age | Person;let combined1: Combined = 25;
let combined2: Combined = {name: 'Carol',age: 28
};// 根据级别判断 1 是否包含在 number / Object 中
type num = 1 extends number ? 1 : 0; // num = 1
type num1 = 1 extends Object ? 1 : 0; // num1 = 1

类型别名的特点:

  1. 类型别名使用 type 关键字来声明。

  2. 类型别名可以代表任何类型,包括基本类型、复杂类型、函数类型等,还可以用于创建联合类型、交叉类型和其他自定义类型。

  3. 类型别名不会创建新的类型,它只是为现有类型提供了一个别名。

typeinterface 的区别

在 TypeScript 中,typeinterface 都用于创建自定义类型,但它们在某些方面有一些不同。以下是 typeinterface 的区别:

  1. 语法:

    • 使用 type 关键字创建类型别名。
    • 使用 interface 关键字创建接口。
  2. 扩展:

    • type 可以表示联合类型、交叉类型、基本类型等,也可以用于为现有类型创建别名。但是,type 不支持扩展,即不能用 extends 来扩展其他类型,但是可以 type s = number[] & B (此时 B 是 interface 的定义的接口)。
    • interface 可以表示对象类型、函数类型、类的成员、可索引类型等,它支持继承和实现其他接口。
  3. 实现:

    • type 不支持 implements,不能用于强制一个类去实现某些类型。
    • interface 支持 implements,可以用于确保一个类满足某些特定的契约。
  4. 合并:

    • interface 具有合并机制,当你声明同名的多个接口时,它们会自动合并为一个接口。
    • type 不具有合并机制,多次声明同名的 type 会报错。
  5. 适用场景:

    • 如果你只需要描述对象的结构,特别是在面向对象的编程中,使用 interface 更加合适。
    • 如果你需要创建复杂的联合类型、交叉类型,或者给现有类型取别名,使用 type 更加合适。

举个例子,假设我们要描述一个 Person 对象:

// 使用 interface
interface PersonInterface {name: string;age: number;
}// 使用 type
type PersonType = {name: string;age: number;
};

相关文章:

【TypeScript】类型推论和类型别名

类型推断 TypeScript 的类型推断是一种编译器能够自动分析代码并确定变量的类型的功能。它允许你在声明变量时省略类型注释,让 TypeScript 根据变量的值来推断出合适的类型。 以下是 TypeScript 类型推断的一些示例和情况: 基本类型推断: …...

字节码调教的入口 —— JVM 的寄生插件 javaagent 那些事

Java Instrumentation 包 Java Instrumentation 概述 Java Instrumentation 这个技术看起来非常神秘,很少有书会详细介绍。但是有很多工具是基于 Instrumentation 来实现的: APM 产品: pinpoint、skywalking、newrelic、听云的 APM 产品等都基于 Instru…...

Blender卡通着色入门

当想到 Blender 和 3D 设计时,你的想法可能会转向风格化渲染或照片级渲染和 VFX。 但是,你是否知道 Blender 还可以创建可与 2D 动漫风格和漫画书类似的图形? 推荐:用 [NSDT编辑器 快速搭建可编程3D场景 1、什么是卡通着色&#x…...

性能调优篇 一、Jvm监控及诊断工具-命令行篇

目录 一、概述1、简单命令行工具 二、jps:查看正在运行的Java程序1、是什么?2、测试3、基本语法 三、jstat:查看jvm统计信息 一、概述 性能诊断是软件工程师 1、简单命令行工具 二、jps:查看正在运行的Java程序 1、是什么&…...

Docker部署MongoDB 5.0.5

1、查看目录 rootwielun:~# tree mongo mongo ├── conf │ └── mongod.conf ├── data ├── docker-compose.yml └── logrootwielun:~# cd mongo rootwielun:~/mongo# chmod 777 log2、配置docker-compose.yml rootwielun:~/mongo# cat docker-compose.yml ve…...

Day18-2-地狱回调-Promise-async-await技术

文章目录 Promise技术一 回调函数二 异步任务三 回调地狱是什么?四 如何解决回调地狱1 PromisePromise基本用法使用Promise解决地狱回调2 async/awaitPromise技术 一 回调函数 当一个函数作为参数传入另一个函数中,并且它不会立即执行,只有当满足一定条件后该函数才可以执…...

echarts范围限制下性能问题

最近实习遇到一个问题,需要对折线图的数据进行范围限制,比如将超过100的设置为100,低于0的设置为0; 原来的代码是创建一个数组,然后遍历原数组,超过的push100,低于0的push0,在中间的…...

wazuh环境配置以及案例复现

目录 wazuh环境配置wazuh案例复现 wazuh环境配置 一、wazuh配置 1.1进入官网下载OVA启动软件 Virtual Machine (OVA) - Installation alternatives (wazuh.com) 1.2点击启动部署,傻瓜式操作 1.3通过账号:wazuh-user,密码:wazuh进…...

解决el-select回显异常 显示option选项的value 而不是显示label

1、问题 回显的value和选项value类型不同 form中v-model"form.userId"是字符串类型 option中:value“item.userId” 选项id是数字类型 2、办法 :value“item.userId” 改为 :value“item.iduserId‘’”&#xff08;转换成字符串&#xff09; <el-form-item l…...

【【STM32-SPI通信协议】】

STM32-SPI通信协议 STM32-SPI通信协议 •SPI&#xff08;Serial Peripheral Interface&#xff09;是由Motorola公司开发的一种通用数据总线 •四根通信线&#xff1a;SCK&#xff08;Serial Clock&#xff09;、MOSI&#xff08;Master Output Slave Input&#xff09;、MISO…...

板卡常用前端 数据表操作

两年前写的&#xff0c;现在看,有点想吐, 数据操作表,调试设备用 采用外挂的方法&#xff0c;以前设备的接口命令,简易&#xff0c;换个UI展示很容易 自己写着玩的,公司部分产品再用,前端展示,不涉密 index.html <!doctype html> <html><head><meta chars…...

基于AVR128单片机世界电子时钟的设计

一、系统方案 上电初始化完成系统初始化&#xff0c;液晶滚动显示北京、莫斯科、东京、伦敦、巴黎、纽约等六个城市的标准时间&#xff0c;显示的内容包括地区名及相应地区的年、月、日、星期、时、分、秒。 使用K1按键控制滚动显示或稳定显示某个地区的时间。 使用K3、K4、K5按…...

Electron学习2 使用Electron-vue和Vuetify UI库

Electron学习2 使用Electron-vue和Vuetify UI库 一、Electron-vue简介二、安装yarn三、创建Electron-vue项目1. 关于 electron-builder2. 安装脚手架3. 运行4. 打包应用程序 四、background.js说明1. 引入模块和依赖&#xff1a;2. 注册协议&#xff1a;3. 创建窗口函数&#x…...

Java“牵手”根据商品分类ID获取速卖通商品分类详情页面数据获取方法,速卖通API实现批量商品数据抓取示例

速卖通商城是一个网上购物平台&#xff0c;售卖各类商品&#xff0c;包括服装、鞋类、家居用品、美妆产品、电子产品等。要获取速卖通商品分类详情和商品列表和商品详情页面数据&#xff0c;您可以通过开放平台的接口或者直接访问速卖通商城的网页来获取商品分类详情信息。以下…...

QT 使用图表

目录 1、概念 1.1 坐标轴-QAbstractAxis 1.2 系列-QAbstractSeries 1.3 图例-Legend 1.4 图表-QChart 1.5 视图-QChartView 2、 QT 折线图 2.1 Qt 折线图介绍 2.2 Qt 折线图实现 Qt 图表是专门用来数据可视化的控件 Qt 图表包含折线、饼图、棒图、散点图、范围图等。…...

SSRF 服务器端请求伪造

文章目录 SSRF(curl)网址访问通过file协议访问本地文件dict协议扫描内网主机开放端口 SSRF(file_get_content)网站访问http协议请求内网资源通过file协议访问本地文件 SSRF(Server-Side Request Forgery:服务器端请求伪造) 其形成的原因大都是由于服务端提供了从其他服务器应用…...

shell 05(shell索引数组变量)

一、数组 shell 支持数组 (Array)&#xff0c;数组是若干数据的集合&#xff0c;其中的每一份数据都称为数组的元素. 注意Bash shell 只支持一维数组&#xff0c;不支持多维数组。 在 Shell 中&#xff0c;用括号( )来表示数组&#xff0c;数组元素之间用空格来分隔. 语法为&…...

爬虫异常处理:异常捕获与容错机制设计

作为一名专业的爬虫程序员&#xff0c;每天使用爬虫IP面对各种异常情况是我们每天都会遇到的事情。 在爬取数据的过程中&#xff0c;我们经常会遇到网络错误、页面结构变化、被反爬虫机制拦截等问题。在这篇文章中&#xff0c;我将和大家分享一些关于如何处理爬虫异常情况的经…...

Python自动化小技巧21——实现PDF转word功能(程序制作)

案例背景 为什么这个年代PDF转word&#xff0c;某wps居然还要收费.....很多软件都可以实现这个功能&#xff0c;但是效果都有好有坏&#xff0c;而且有的还付费&#xff0c;很麻烦。 那就用python实现这个功能吧&#xff0c;然后把代码打包为.exe的程序&#xff0c;这样随便在…...

Vue使用Element的表格Table显示树形数据,多选框全选无法选中全部节点

使用Element的组件Table表格&#xff0c;当使用树形数据再配合上多选框&#xff0c;如下&#xff1a; 会出现一种问题&#xff0c;点击左上方全选&#xff0c;只能够选中一级树节点&#xff0c;子节点无法被选中&#xff0c;如图所示&#xff1a; 想要实现点击全选就选中所有的…...

SpringBoot-17-MyBatis动态SQL标签之常用标签

文章目录 1 代码1.1 实体User.java1.2 接口UserMapper.java1.3 映射UserMapper.xml1.3.1 标签if1.3.2 标签if和where1.3.3 标签choose和when和otherwise1.4 UserController.java2 常用动态SQL标签2.1 标签set2.1.1 UserMapper.java2.1.2 UserMapper.xml2.1.3 UserController.ja…...

基于FPGA的PID算法学习———实现PID比例控制算法

基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容&#xff1a;参考网站&#xff1a; PID算法控制 PID即&#xff1a;Proportional&#xff08;比例&#xff09;、Integral&#xff08;积分&…...

【位运算】消失的两个数字(hard)

消失的两个数字&#xff08;hard&#xff09; 题⽬描述&#xff1a;解法&#xff08;位运算&#xff09;&#xff1a;Java 算法代码&#xff1a;更简便代码 题⽬链接&#xff1a;⾯试题 17.19. 消失的两个数字 题⽬描述&#xff1a; 给定⼀个数组&#xff0c;包含从 1 到 N 所有…...

高频面试之3Zookeeper

高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个&#xff1f;3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制&#xff08;过半机制&#xff0…...

OkHttp 中实现断点续传 demo

在 OkHttp 中实现断点续传主要通过以下步骤完成&#xff0c;核心是利用 HTTP 协议的 Range 请求头指定下载范围&#xff1a; 实现原理 Range 请求头&#xff1a;向服务器请求文件的特定字节范围&#xff08;如 Range: bytes1024-&#xff09; 本地文件记录&#xff1a;保存已…...

PL0语法,分析器实现!

简介 PL/0 是一种简单的编程语言,通常用于教学编译原理。它的语法结构清晰,功能包括常量定义、变量声明、过程(子程序)定义以及基本的控制结构(如条件语句和循环语句)。 PL/0 语法规范 PL/0 是一种教学用的小型编程语言,由 Niklaus Wirth 设计,用于展示编译原理的核…...

ArcGIS Pro制作水平横向图例+多级标注

今天介绍下载ArcGIS Pro中如何设置水平横向图例。 之前我们介绍了ArcGIS的横向图例制作&#xff1a;ArcGIS横向、多列图例、顺序重排、符号居中、批量更改图例符号等等&#xff08;ArcGIS出图图例8大技巧&#xff09;&#xff0c;那这次我们看看ArcGIS Pro如何更加快捷的操作。…...

【开发技术】.Net使用FFmpeg视频特定帧上绘制内容

目录 一、目的 二、解决方案 2.1 什么是FFmpeg 2.2 FFmpeg主要功能 2.3 使用Xabe.FFmpeg调用FFmpeg功能 2.4 使用 FFmpeg 的 drawbox 滤镜来绘制 ROI 三、总结 一、目的 当前市场上有很多目标检测智能识别的相关算法&#xff0c;当前调用一个医疗行业的AI识别算法后返回…...

企业如何增强终端安全?

在数字化转型加速的今天&#xff0c;企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机&#xff0c;到工厂里的物联网设备、智能传感器&#xff0c;这些终端构成了企业与外部世界连接的 “神经末梢”。然而&#xff0c;随着远程办公的常态化和设备接入的爆炸式…...

Unsafe Fileupload篇补充-木马的详细教程与木马分享(中国蚁剑方式)

在之前的皮卡丘靶场第九期Unsafe Fileupload篇中我们学习了木马的原理并且学了一个简单的木马文件 本期内容是为了更好的为大家解释木马&#xff08;服务器方面的&#xff09;的原理&#xff0c;连接&#xff0c;以及各种木马及连接工具的分享 文件木马&#xff1a;https://w…...