【TypeScript】类型推断与类型别名的使用方式。

在这里插入图片描述

什么是类型推断?

在 TypeScript 中, 如果声明变量时,没有明确的指定类型,那么 TypeScript 会依照类型推论(Type Inference)的规则推断出一个类型。

以下代码虽然没有明确指定类型,但是会在编译的时候报错:

let myiten = "字符串"

myiten = 123

在这里插入图片描述
事实上,它等价于:

let myiten:string = "字符串"

myiten = 123

TypeScript 会在没有明确的指定类型的时候,可以根据初始化默认赋值的类型,推测出一个类型,默认把初始值的类型,就当做变量的类型,这就是类型推论。


如果定义的时候没有明确指定类型,并且也没有初始化赋值,那么不管之后有没有赋值,都会被推断成 any 类型而完全不被类型检查:

let myiten

myiten = false;
myiten = undefined;
myiten = "字符串";
console.log(myiten.length); //不会报错
myiten = 123;
console.log(myiten.length);  //这里会报错,因为 myiten 已经不再是 String了,类型已经被更改了,如果再读取 字符串的方法,就会报错。

作为函数时,如果没有手动指定返回值类型,则也会根据我们的 实际返回值,进而推断出返回值类型
在这里插入图片描述


类型别名

语法:type 别名 = 类型

  • 类型别名概念:主要用来给一个给较为复杂的类型起个新名字
  • 作用:把多个类型合并为一个类型
  • 好处:简化和复用类型

上案例:

数组定义类型时采用,类型别名

type TypeItem = (string | number);  //给类型自定义名称
type str = boolean | number | Boolean; //给类型自定义整合名称


let arr: TypeItem[] = [456]; //给变量直接赋值类型别名

let arr1: Array<str> = [123, false];//给变量直接赋值类型别名

let arr2: Array<(TypeItem)> = [123, "字符串"];//给变量直接赋值类型别名


type un = TypeItem | str;  //甚至还可以通过type 将多个类型别名进行再次整合。

let arrun: Array<un> = [789, "array", false];  //给变量赋值类型别名二次整合后的。

类型别名运用在普通变量和函数身上时:

type TypeItem = (string | number);

type str = boolean | null;

type un = TypeItem | str;


//类型别名用在普通变量身上
let a: un = false;
a = null;
a = false;
a = 456;
a = "fe";
a = {}  //会报错,所属类型不包含 OBJ{}   //不能将类型“{}”分配给类型"“un”。


//类型别名用在函数身上
function fn(a: un, b: un): un {

    return {}  //会报错,返回值所属类型不包含 OBJ{}   //不能将类型“{}”分配给类型"“un”。

}

类型别名常用于联合类型。作用好处是,简化和复用类型

总结:
本章节给大家介绍了在 【TypeScript】 中 类型推断的解读,以及定义类型别名的使用方式。


🚵‍♂️ 博主座右铭:向阳而生,我还在路上!
——————————————————————————————
🚴博主想说:将持续性为社区输出自己的资源,同时也见证自己的进步!
——————————————————————————————
🤼‍♂️ 如果都看到这了,博主希望留下你的足迹!【📂收藏!👍点赞!✍️评论!】
——————————————————————————————

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

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

相关文章

【043】解密C++ STL:深入理解并使用 list 容器

解密C STL&#xff1a;深入理解并使用list容器 引言一、list 容器概述二、list容器常用的API2.1、构造函数2.2、数据元素插入和删除操作2.3、大小操作2.4、赋值操作2.5、数据的存取2.6、list容器的反转和排序 三、使用示例总结 引言 &#x1f4a1; 作者简介&#xff1a;一个热爱…

浮点型在内存中的存储

目录 1.浮点数是什么&#xff1f; 2. 浮点数存储规则 1.浮点数是什么&#xff1f; 就是数学中的小数。 常见的浮点数&#xff1a; 3.14159 1E10&#xff08;1*10^10&#xff09; 浮点数家族包括&#xff1a; float、double、long double 类型。 浮点数表示的范围&#x…

Bean的生命周期

目录 1、实例化Bean 2、设置Bean的属性 3、初始化Bean &#xff08;1&#xff09;、执行通知 &#xff08;2&#xff09;、初始化的前置方法 &#xff08;3&#xff09;、初始化方法 &#xff08;4&#xff09;、执行自定义方法 &#xff08;5&#xff09;、初始化的后置…

API接口:如何通过使用手机归属地查询

随着手机普及率的不断增加&#xff0c;手机号码的信息查询也成为了一个非常实用的功能。本文将介绍如何通过使用手机归属地查询API接口实现查询手机号码所在地的功能。 首先&#xff0c;我们需要一个可以查询手机号码所在地的API接口。目前市面上有很多免费或付费的API接口可供…

《Ansible自动化工具篇:ubuntu操作系统基于ansible工具一键远程离线部署之K8S1.24.12二进制版集群》

一、部署背景 由于业务系统的特殊性&#xff0c;我们需要针对不同的客户环境部署二进制版K8S集群&#xff0c;由于大都数用户都是专网环境&#xff0c;无法使用外网&#xff0c;为了更便捷&#xff0c;高效的部署&#xff0c;针对业务系统的特性&#xff0c;我这边编写了 基于a…

uni-app中的uni.requireNativePlugin()

这个方法是用来引入原生插件的方法&#xff0c;自 HBuilderX 1.4 版本起&#xff0c;uni-app 支持引入原生插件&#xff0c;使用方式如下&#xff1a; const PluginName uni.requireNativePlugin(PluginName); // PluginName 为原生插件名称 引入插件的类型有三种&#xff1…

【idea工具】idea工具,build的时候提示:程序包 com.xxx.xx不存在的错误

idea工具&#xff0c;build的时候提示:程序包 com.xxx.xx不存在的错误&#xff0c;如下图&#xff0c;折腾了好一会&#xff0c; 做了如下操作还是不行&#xff0c;idea工具编译的时候&#xff0c;还是提示 程序包不存在。 a. idea中&#xff0c;重新导入项目&#xff0c;也还…

Mysql-主从复制与读写分离

Mysql 主从复制、读写分离 一、前言&#xff1a;二、主从复制原理1.MySQL的复制类型2. MySQL主从复制的工作过程;3.MySQL主从复制延迟4. MySQL 有几种同步方式&#xff1a;5.Mysql应用场景 三、主从复制实验1.主从服务器时间同步1.1 master服务器配置1.2 两台SLAVE服务器配置 2…

小程序自定义步骤条实现

效果展示&#xff1a; 支持背景颜色自定义 <view class"hl_steps"><view class"hl_steps_item" wx:for"{{steps}}" wx:key"id"><view class"hl_steps_item_circle_out" style"background-color: {{col…

【Linux网络】 网络套接字(三)socket编程_TCP网络程序

目录 TCP网络程序服务端创建套接字并绑定服务端监听服务端获取连接服务器处理请求 客户端客户端创建套接字客户端连接服务器客户端发起请求测试 服务器存在的问题多进程版的TCP网络程序多线程版的TCP网络程序线程池版的TCP网络程序 TCP网络程序总结图 TCP网络程序 服务端 创建…

踩坑_vertical-align

目录 问题&#xff1a;vertical-align属性语法父元素的基线怎么找呢&#xff1f;特殊元素的基线行盒 解决 问题&#xff1a; 今天在做一个需求时遇到了如下问题&#xff1a; 代码 <style>*{margin:0;padding:0;}#app{width: 300px;height: 117px;background: #FFFFFF;bo…

通过v-for生成的input无法连续输入

部分代码&#xff1a;通过v-for循环生成el-form-item&#xff0c;生成多个描述输入框 更改之前的代码&#xff08;key绑定的是item&#xff09;&#xff1a; <el-form-item class"forminput" v-for"(item,index) in formdata.description" :key"…

打造高效便捷的采购管理平台,提升企业采购效率

随着企业规模的扩大和供应链的日益复杂&#xff0c;传统的手工采购管理方式已经不能满足企业的需求。采购管理平台的出现为企业提供了一个集中、高效、便捷的采购管理工具。本文将重点探讨采购管理平台的意义与作用&#xff0c;并介绍如何打造一个高效便捷的采购管理平台。 一、…

PHY芯片的使用(三)在linux下网络PHY的移植

1 前言 配置设备树请参考上一章。此次说明还是以裕太的YT8511芯片为例。 2 需要配置的文件及路径 a. 在 .. /drivers/net/phy 目录下添加 yt_phy.c 文件&#xff08;一般来说该驱动文件由厂家提供&#xff09;&#xff1b; b. 修改.. /drivers/net/phy 目录下的 Kconfig 文…

欧盟新规,燃油噩梦?2025年起,高速公路每60公里设立一处快充站

根据外媒The Verge报道&#xff0c;欧洲电动汽车用户将获得更多便捷的待遇&#xff0c;同时还能减少有害温室气体排放&#xff0c;这得益于欧盟理事会最新通过的法规。 根据欧盟的法规要求&#xff0c;自2025年起&#xff0c;TEN-T高速公路系统在欧洲将需要每隔60公里设立一座高…

C# List 详解六

目录 35.MemberwiseClone() 36.Remove(T) 37.RemoveAll(Predicate) 38.RemoveAt(Int32) 39.RemoveRange(Int32, Int32) 40.Reverse() 41.Reverse(Int32, Int32) C# List 详解一 1.Add(T)&#xff0c;2.AddRange(IEnumerable)&#xff0c;3…

【Linux】冯诺依曼体系结构思想

冯诺依曼体系结构 冯诺依曼体系结构冯诺依曼体系结构的五大部分冯诺依曼体系结构的运行过程存储器中的木桶效应扩展&#xff1a;计算机存储设备金字塔实例&#xff1a;qq聊天数据传输过程 &#x1f340;小结&#x1f340; &#x1f389;博客主页&#xff1a;小智_x0___0x_ &…

手机+App=电脑静音无线鼠标 - WiFimouse初体验

应用情景 大晚上的别人在睡觉&#xff0c;自己又不得不使用电脑&#xff08;台式&#xff09;&#xff0c;鼠标点点点又吵。 专门买个静音鼠标又没钱&#xff0c;咋办~ 效果图 手机app 电脑无线触控板&#xff0c;零噪音&#xff01; 可以单击、移动鼠标光标、可以上下滚动…

MinIO在Linux环境下单机安装部署

1、MinIO是什么&#xff1f; MinIO 是一个基于 Go语言实现的高性能对象存储。它采用AGPL&#xff08;GNU Affero General Public License&#xff09; 开源协议并兼容 S3 协议。 官网地址&#xff1a;https://min.io/ github地址&#xff1a;https://github.com/minio/minio …