TypeScript 枚举指南,看完让你一目了然-阿里云开发者社区

开发者社区> pcr5nnbbix3xm> 正文

TypeScript 枚举指南,看完让你一目了然

简介: 枚举是受 TypeScript 支持的数据类型。枚举允许您定义一组命名常量。使用它们可以更轻松地记录意图或创建一组不同的案例。枚举大多数用于面向对象的编程语言(如 Java 和 C#)中,现在也可以 TypeScript 中使用。它们是 TypeScript 的少数功能之一,它不是 JavaScript 的类型级扩展。
+关注继续查看

TypeScript 中的枚举是什么
许多编程语言(例如 C,C# 和 Java)都具有 enum 数据类型,而 JavaScript 没有。但是 TypeScript 可以,TypeScript 具有基于数字和基于字符串的枚举。TypeScript 枚举允许开发人员定义一组命名常量。使用它们可以更轻松地记录意图或创建一组不同的案例。

枚举的语法如下:

enum States {
    Apple,
    Orange,
    Banana,
    Watermelon
}
// 使用
var fruit = States.Watermelon;

在 TypeScript 中使用枚举需要注意什么
首先枚举中的值是常量,即枚举是类型安全的,在重新分配值时会返回编译错误。其次枚举应该是有限的,有助于用户创建一个自定义的常量系统。枚举在被编译后是一个对象:在 JavaScript 中创建内存有效的自定义常量,使用灵活易于表达记录意图方便作为判断用例。

enum requestStatus {
    success = 200
    error = 400
}

let requestStatus;
(function (requestStatus) {
    requestStatus[requestStatus["success"] = 200] = "success"
    requestStatus[requestStatus["error"] = 400] = "error"
})(requestStatus || (requestStatus = {}));

// requestStatus:
// { '200': 'success', '400': 'error', error: 400, success: 200 }

常见枚举的类型
数值枚举 和 字符串枚举 是我们在 TypeScript 中最常用的枚举类型,下面我将用例子向你们介绍它们的特点以及如何使用它们。

数字枚举

数字枚举以字符串存储数字值 。让我们使用 enum 关键字定义它们。下面我将用存储一组不同类型汽车的示例展示 TypeScript 中的数字枚举:

enum CarType {
    Honda,
    Toyota,
    Subaru,
    Hyundai
}

枚举值 CarType 有四个值:本田,丰田,斯巴鲁和现代。枚举值从 0 开始,并且每个成员的值递增 1 ,如下所示:

Honda = 0
Toyota = 1
Subaru = 2
Hyundai = 3

如果需要你可以自己初始化第一个数值,如下所示:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}

在上面的示例中,Honda 使用数值 1 初始化了第一个成员。剩余的数字将加一。
你可能会想,如果我更改最后一个值,之前的值会根据最后定义的数值递减吗?让我们来试试:

enum CarType {
    Honda,
    Toyota,
    Subaru,
    Hyundai = 100
}

遗憾的是这是行不通的,当前例子的数值是:

enum CarType {
    Honda,  // 1
    Toyota, // 2
    Subaru, // 3
    Hyundai // 100
}

注意:不必为枚举成员分配顺序值。你可以为其分配任何所需的值

字符串枚举
字符串枚举类似于数字枚举,但是它们的枚举值是使用字符串值而不是数字值初始化的。 字符串枚举比数字枚举具有更好的可读性 ,从而更容易调试程序。

以下示例使用与数值枚举示例相同的信息,但以字符串枚举表示:

enum CarType {
    Honda = "HONDA",
    Toyota = "TOYOTA",
    Subaru = "SUBARU",
    Hyundai = "HYUNDAI"
}

// 访问字符串枚举
CarType.Toyota; //return TOYOTA

注意:字符串枚举值需要单独初始化。

枚举反向映射
枚举可以使用其相对应的枚举成员值检索 num 值。使用反向映射,可以访问成员值和成员值的名称,请看下面的例子:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}
CarType.Subaru; //return 3
CarType.["Subaru"]; //return 3
CarType[3]; //return Subaru

CarType[3] 由于反向映射,返回其成员名称“ Subaru”。让我们看另一个例子:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}
console.log(CarType)

在浏览器的控制台中将看到以下输出:

{ 
    '1':'Honda',
    '2':'Toyota',
    '3':'Subaru',
    '4':'Hyundai',
    Honda:1,
    Toyota:2,
    Subaru:3,
    Hyundai:4 
}

枚举的每个值在内部存储的枚举对象中出现两次。

计算枚举
枚举成员的值可以是常量值或计算值。请看下面的示例:

enum CarType {
    Honda = 1,
    Toyota = getCarTypeCode('toyota'),
    Subaru = Toyota * 3,
    Hyundai = 10
}

function getCarTypeCode(carName: string): number {
    if (carName === 'toyota') {
        return 5;
    }
}

CarType.Toyota; // returns 5
CarType.Subaru; // returns 15

如果枚举既包含计算成员又包含常量成员,则未初始化的枚举成员将首先出现,也可能在其他带有数字常量的初始化成员之后。下一个示例将显示错误:

enum CarType {
    Toyota = getCarTypeCode('toyota'),
    Honda, // Error: Enum member must have initializer
    Subaru,
    Hyundai = Toyota * 3,
}

你可以这样声明上述枚举:

enum CarType {
    Honda,
    Hyundai,
    Toyota = getCarTypeCode('toyota'),
    Subaru = Toyota * 3

如果你想开发小程序或者了解更多小程序的内容,可以通过专业开发公司,来帮助你实现开发需求:厦门在乎科技-专注厦门小程序开发公司、APP开发、网站开发、H5小游戏开发

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
怎么设置阿里云服务器安全组?阿里云安全组规则详细解说
阿里云服务器安全组设置规则分享,阿里云服务器安全组如何放行端口设置教程
7435 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
4619 0
使用OpenApi弹性释放和设置云服务器ECS释放
云服务器ECS的一个重要特性就是按需创建资源。您可以在业务高峰期按需弹性的自定义规则进行资源创建,在完成业务计算的时候释放资源。本篇将提供几个Tips帮助您更加容易和自动化的完成云服务器的释放和弹性设置。
8268 0
阿里云服务器安全组设置内网互通的方法
虽然0.0.0.0/0使用非常方便,但是发现很多同学使用它来做内网互通,这是有安全风险的,实例有可能会在经典网络被内网IP访问到。下面介绍一下四种安全的内网互联设置方法。 购买前请先:领取阿里云幸运券,有很多优惠,可到下文中领取。
9513 0
windows server 2008阿里云ECS服务器安全设置
最近我们Sinesafe安全公司在为客户使用阿里云ecs服务器做安全的过程中,发现服务器基础安全性都没有做。为了为站长们提供更加有效的安全基础解决方案,我们Sinesafe将对阿里云服务器win2008 系统进行基础安全部署实战过程! 比较重要的几部分 1.
5534 0
腾讯云服务器 设置ngxin + fastdfs +tomcat 开机自启动
在tomcat中新建一个可以启动的 .sh 脚本文件 /usr/local/tomcat7/bin/ export JAVA_HOME=/usr/local/java/jdk7 export PATH=$JAVA_HOME/bin/:$PATH export CLASSPATH=.
2247 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,云吞铺子总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系统盘、创建快照、配置安全组等操作如何登录ECS云服务器控制台? 1、先登录到阿里云ECS服务器控制台 2、点击顶部的“控制台” 3、通过左侧栏,切换到“云服务器ECS”即可,如下图所示 通过ECS控制台的远程连接来登录到云服务器 阿里云ECS云服务器自带远程连接功能,使用该功能可以登录到云服务器,简单且方便,如下图:点击“远程连接”,第一次连接会自动生成6位数字密码,输入密码即可登录到云服务器上。
17378 0
+关注
pcr5nnbbix3xm
专注小程序、APP、网站开发
48
文章
11
问答
文章排行榜
最热
最新
相关电子书
更多
文娱运维技术
立即下载
《SaaS模式云原生数据仓库应用场景实践》
立即下载
《看见新力量:二》电子书
立即下载