TypeScript枚举类型、类型断言

news2024/10/6 12:28:21

一. 概念

TypeScript中的枚举是一种数据类型,它是一组具有预定义名称的有限值的集合。枚举类型可以使代码更加可读、可维护和易于理解。
类似对象,枚举是将一组无序但极度相关数组集合在一起声明存储。

二. 枚举特性

1. 内部进行了双向赋值

 enum Numbers  {
    a,
    b,
    c
}

源码

var Numbers;
(function(Numbers) {
    Numbers[Numbers['a'] = 0] = 'a';
    Numbers[Numbers['b'] = 1] = 'b';
    Numbers[Numbers['c'] = 2] = 'c';
})(Numbers || (Numbers = {}))

打印结果

console.log(Numbers[a]) // 0
console.log(Numbers['0']) // 'a'

2. 即可以作为一种类型,也可以作为一种存储方式

1.作为一种类型

enum Colors {
    SUCCESS = 'green',
    DANGER = 'red',
    WARN = 'orange'
}
const buttonClor:Colors = Colors['SUCCESS']
console.log(buttonClor) // 'green'

其中Colors作为一种类型

如果直接赋值的话,类型就会改变

enum Colors {
    SUCCESS = 'green',
    DANGER = 'red',
    WARN = 'orange'
}
const buttonClor:Colors = 'green'

会有如下报错
在这里插入图片描述
上述例子,在赋值的同时,同时也把buttonClor的类型限制为string,因为buttonClor的赋值范围是固定的,所以用枚举可以缩小其赋值范围,更加准确

2. 作为一种存储方式
例如上述例子,我们也可以通过Colors[‘SUCCESS’]去获取数据,说明枚举Colors作为一个容器,也存储了数据,并支持访问。同时也避免了大量常量的赋值和使用

三. 实战演练

1. 完整代码

enum typeEnum {
    ID,
    CONTENT,
    COMPLETED
}



interface toDoTypeValue  {
    id: number,
    content: string,
    completed: boolean
}

const todoSet:toDoTypeValue = {
    id: 1,
    content: '',
    completed: false
}
type typeValue = number | string |boolean

function setTodo (type:typeEnum, value:typeValue) {
    switch(type) {
        case typeEnum.ID:
        todoSet.id = value as number;
        break;
        case typeEnum.CONTENT:
            todoSet.content = value as string;
            break;
            case typeEnum.COMPLETED:
            todoSet.completed = value as boolean;
            break;
    }
}

setTodo(typeEnum.ID,1)
setTodo(typeEnum.CONTENT,'hello jack')
setTodo(typeEnum.COMPLETED,true);
console.log(todoSet)

打印结果

{
  "id": 1,
  "content": "hello jack",
  "completed": true
} 

2. 使用枚举的好处

使用对象中的typeof

function setTodo (value) {
    switch(typeof value) {
        case 'number':
        todoSet.id = value;
        break;
        case 'string':
            todoSet.content = value;
            break;
            case 'boolean':
            todoSet.completed = value;
            break;
    }
}

缺点:后续对象可能会添加多个属性,所以一种类型可能对应了多个属性,可维护性差。

type使用常量


function setTodo (type,value) {
    switch(type) {
        case 'id':
        todoSet.id = value;
        break;
        case 'content':
            todoSet.content = value;
            break;
            case 'completed':
            todoSet.completed = value;
            break;
    }
}

setTodo('id',1)
setTodo('content','hello jack')
setTodo('completed',true);

缺点: 如果有多个属性,需要书写多个属性常量,并且多个属性零散,没有统一维护。代码不够优雅,且可维护性差

四. value为什么使用类型断言?

function setTodo (type:typeEnum, value:typeValue) {
    switch(type) {
        case typeEnum.ID:
        todoSet.id = value as number;
        break;
        case typeEnum.CONTENT:
            todoSet.content = value as string;
            break;
            case typeEnum.COMPLETED:
            todoSet.completed = value as boolean;
            break;
    }
}

因为todoSet的属性的值的类型都是确定的,但是value的值是typeValue的数据类型是多种类型的其中一种,没有确定类型,所以需要断言确定value的类型

type data = string | number
function test(parmas:data):data {
    let resdata = parmas;
    return resdata
}

像这种resdata未指定类型,就不需要进行类型断言。

总结:在某些特定的情况下,类型别名可能无法提供足够的精度来满足编译器,使用类型断言来显式地将类型转换为相应的类型可以为此类情况提供解决方案。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

奕碳科技亮相COP28:展现中国智慧,引领全球碳减排新篇章

11月30日,联合国气候变化框架公约第28次缔约方大会 (COP28) 在阿联酋迪拜开幕。COP28是全球气候治理的重要盛会,汇聚了世界各国领导人、企业界和科学界代表,共同探讨和制定应对全球气候变化的策略与行动计划。在这样的背景下,企业群体的积极参…

力扣题:字符的统计-12.7

力扣题-12.7 [力扣刷题攻略] Re:从零开始的力扣刷题生活 力扣题1:467. 环绕字符串中唯一的子字符串 解题思想:记录下以字母s[i]结尾的最大的字串个数,然后统计a-z每个字母结尾的最大字串的个数进行i相加 class Solution(object…

「Verilog学习笔记」同步FIFO

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点,刷题网站用的是牛客网 timescale 1ns/1ns /**********************************RAM************************************/ module dual_port_RAM #(parameter DEPTH 16,parameter WIDTH 8)(in…

Anaconda建虚拟环境并在jupyter中打开

1.假设要用yaml格式创建虚拟环境 从开始里打开anaconda powersheel 输入以下 conda env create -f environment.yaml conda activate env_name activate以下虚拟环境 修改名称 如果不用yaml也可以用 conda create --name my_first_env python3.6 这个来指定 2.(base)变(…

海思3516DV500下的目标识别算法运行评估,包含yolov7,yolov8

目前在3516DV500下,自己训练的模型的评估实测结果。根据实际模型会有些许差异。 涉及到技术细节的部分因为商业用途,有部分省略。如需相关技术服务项目合作可私信联系。 我司推出的目标识别跟踪模块,支持热红外、可见光主流多光谱视频输入与目…

LCR 090. 打家劫舍 II(leetcode)动态规划

文章目录 前言一、题目分析二、算法原理1.状态表示2.状态转移方程3.初始化4.填表顺序5.返回值是什么 三、代码实现总结 前言 在本文章中,我们将要详细介绍一下LeetcodeLCR 090. 打家劫舍 II。采用动态规划解决,这是一道经典的多状态dp问题 一、题目分析…

微前端 -- wujie 预加载和原理 无界传参

目录 wujie 预加载和原理 原理解析 MessageChannel 无界传参 1.全局变量 2.Props 3.event bus wujie 预加载和原理 提前把无界实例创建好 runPreload 赋值给sandbox.preload 预先加载好 startApp 判断是否有preload 需要从wujie的实例导出preloadApp,参数跟startApp 一…

Grad-CAM原理

这篇是我对哔哩哔哩up主 霹雳吧啦Wz 的视频的文字版学习笔记 感谢他对知识的分享 只要大家一提到深度学习 缺乏一定的解释性 比如说在我们之前讲的分类网络当中 网络它为什么要这么预测 它针对每个类别所关注的点在哪里呢 在great cam这篇论文当中呢 就完美的解决了在cam这篇论…

《文存阅刊》期刊发表简介

《文存阅刊》以“深研文化创新,崇尚科学真理,坚持双百方针,打造学术精品”为办刊宗旨,涵盖艺术、文学、社科等多项内容,适应了文化市场需求,很好的回应了广大文化理论工作者的关切,为下一步打造…

QMenu风格设计qss+阴影

Qt的菜单经常在软件开发中用到&#xff0c;默认的菜单效果都不符合设计师的要求&#xff0c;本篇介绍QMenu菜单的风格设计&#xff0c;包括样式表和阴影。 1.QMenu样式表的设计 首先看一个默认的菜单 void QGraphicsDropShadowEffectDemo::slotShowDialog() {qDebug() <&l…

机器学习第15天:GBDT模型

☁️主页 Nowl &#x1f525;专栏《机器学习实战》 《机器学习》 &#x1f4d1;君子坐而论道&#xff0c;少年起而行之 ​​ 文章目录 GBDT模型介绍 Boosting 残差 GBDT的缺点 python代码实现 代码 模型参数解释 结语 GBDT模型介绍 GBDT&#xff08;Gradient Boos…

pytest +uiautomator2+weditor app自动化从零开始

目录结构1.0 把设备连接单独移出去了 模块操作代码&#xff0c;有一些流程操作和断言方法 from devices import dv from time import sleep import random from tool.jt import capture_screenshotdef initialization(func):def wrapper():sleep(1)dv.app_stop(com.visteon.…

Linux学习笔记3 xshell(lnmp)

xshell能连接虚拟机的前提是真机能够ping通虚拟机网址 装OpenSSL依赖文件 [rootlocalhost nginx-1.12.2]# yum -y install openssl pcre-devel 依赖检测[rootlocalhost nginx-1.12.2]# ./configure [rootlocalhost nginx-1.12.2]# yum -y install zlib [rootlocalhost n…

Windows下使用CMD修改本地IP

在网络适配器界面查看当前网线连接的哪个网口&#xff0c;我当前连的是 以太网 这个名字的&#xff1a; 在windows下使用管理员权限打开CMD命令工具&#xff0c;输入如下命令(如我想本地ip改成192.168.2.4)&#xff1a; netsh interface ip set address "以太网" st…

Vue:用IDEA开发Vue,标签语法爆红问题处理

一、场景描述 我在IDEA中&#xff0c;学习Vue课程。 入门学习时&#xff0c;是在html文件中&#xff0c;script引入vue.js文件方式。 此时&#xff0c;在html文件中用v-标签&#xff0c;爆红。 二、解决办法 打开 菜单栏 File - Settings 选择 Editor - Files Type&#xf…

虾皮关键词广告怎么选

在虾皮&#xff08;Shopee&#xff09;平台上&#xff0c;关键词广告是提高商品曝光度和销量的有效手段。然而&#xff0c;选择合适的关键词对于广告效果至关重要。本文将为您提供一些建议&#xff0c;帮助您选择适合虾皮关键词广告的关键词。 先给大家推荐一款shopee知虾数据…

云上巴蜀丨云轴科技ZStack成功实践精选(川渝)

巴蜀——古政权必争之地 不仅拥有优越的战略位置 而且拥有丰富的自然资源&#xff0c;悠久的历史文化 如今的川渝经济、人口发展迅速 2023年前三季度&#xff0c;四川与重庆GDP增速均超过国家平均线&#xff0c;为6.5%为5.6% 川渝经济发展带动数字化发展浪潮 云轴科技ZSt…

LeetCode题:174. 地下城游戏

目录 一、题目要求 二、解题思路 &#xff08;1&#xff09;状态表示 &#xff08;2&#xff09;状态转移方程 &#xff08;3&#xff09;初始化dp表 &#xff08;4&#xff09;填表顺序 &#xff08;5&#xff09;返回值 三、代码 一、题目要求 174. 地下城游戏 恶魔们…

【学一点儿前端】真机调试本地公众号网页项目

前言 微信公众号网页开发的真机调试一直是很头疼的事情。 原因一 微信公众号配置的JS安全域名只有三个&#xff0c;一个大中型的公众号这三个JS安全域名都是生产的域名&#xff0c;不可能预留域名用于开发和调试。 原因二 在微信里面只有访问正确的安全域名才能调用wx.config用…

电商早报 | 12月8日|母婴电商宝贝格子北京总部已人去楼空

国家邮政局&#xff1a;预计11月快递量同比增长30%&#xff0c;业务收入增长27% 12月7日消息&#xff0c;国家邮政局发布2023年11月中国快递发展指数报告。经测算&#xff0c;2023年11月中国快递发展指数为406.4&#xff0c;同比提升20%。其中发展规模指数、服务质量指数、发展…