枚举(Enum)类型用于取值被限定在一定范围内的场景,比如一周只能有七天,颜色限定为红绿蓝等。

简单的例子


枚举使用 enum 关键字来定义:

enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};

枚举成员会被赋值为从 0 开始递增的数字,同时也会对枚举值到枚举名进行反向映射:

enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};console.log(Days["Sun"] === 0); // true
console.log(Days["Mon"] === 1); // true
console.log(Days["Tue"] === 2); // true
console.log(Days["Sat"] === 6); // trueconsole.log(Days[0] === "Sun"); // true
console.log(Days[1] === "Mon"); // true
console.log(Days[2] === "Tue"); // true
console.log(Days[6] === "Sat"); // true

手动赋值

enum Days {Sun = 7, Mon = 1, Tue, Wed, Thu, Fri, Sat};console.log(Days["Sun"] === 7); // true
console.log(Days["Mon"] === 1); // true
console.log(Days["Tue"] === 2); // true
console.log(Days["Sat"] === 6); // true

上面的例子中,未手动赋值的枚举项会接着上一个枚举项递增。


如果未手动赋值的枚举项与手动赋值的重复了,TypeScript 是不会察觉到这一点的

enum Days {Sun = 3, Mon = 1, Tue, Wed, Thu, Fri, Sat};console.log(Days["Sun"] === 3); // true
console.log(Days["Wed"] === 3); // true
console.log(Days[3] === "Sun"); // false
console.log(Days[3] === "Wed"); // true

上面的例子中,递增到 3 的时候与前面的 Sun 的取值重复了,但是 TypeScript 并没有报错,导致 Days[3] 的值先是 “Sun”,而后又被 “Wed” 覆盖了。所以使用的时候需要注意,最好不要出现这种覆盖的情况。


手动赋值的枚举项可以不是数字,此时需要使用类型断言来让 tsc 无视类型检查 (编译出的 js 仍然是可用的):

enum Days {Sun = 7, Mon, Tue, Wed, Thu, Fri, Sat = <any>"S"};

当然,手动赋值的枚举项也可以为小数或负数,此时后续未手动赋值的项的递增步长仍为 1:

enum Days {Sun = 7, Mon = 1.5, Tue, Wed, Thu, Fri, Sat};console.log(Days["Sun"] === 7); // true
console.log(Days["Mon"] === 1.5); // true
console.log(Days["Tue"] === 2.5); // true
console.log(Days["Sat"] === 6.5); // true

常数项和计算所得项

枚举项有两种类型:常数项(constant member)和计算所得项(computed member)。
前面我们所举的例子都是常数项,一个典型的计算所得项的例子:

enum Color {Red, Green, Blue = "blue".length};

上面的例子中,“blue”.length 就是一个计算所得项。

上面的例子不会报错,但是如果紧接在计算所得项后面的是未手动赋值的项,那么它就会因为无法获得初始值而报错

enum Color {Red = "red".length, Green, Blue};// index.ts(1,33): error TS1061: Enum member must have initializer.
// index.ts(1,40): error TS1061: Enum member must have initializer.

当满足以下条件时,枚举成员被当作是常数:

  • 不具有初始化函数并且之前的枚举成员是常数。在这种情况下,当前枚举成员的值为上一个枚举成员的值加 1。但第一个枚举元素是个例外。如果它没有初始化方法,那么它的初始值为 0。

  • 枚举成员使用常数枚举表达式初始化。常数枚举表达式是 TypeScript 表达式的子集,它可以在编译阶段求值。当一个表达式满足下面条件之一时,它就是一个常数枚举表达式:

  • 数字字面量

  • 引用之前定义的常数枚举成员(可以是在不同的枚举类型中定义的)如果这个成员是在同一个枚举类型中定义的,可以使用非限定名来引用

  • 带括号的常数枚举表达式

  • +, -, ~ 一元运算符应用于常数枚举表达式

  • +, -, *, /, %, <<, >>, >>>, &, |, ^ 二元运算符,常数枚举表达式做为其一个操作对象。若常数枚举表达式求值后为 NaN 或 Infinity,则会在编译阶段报错,所有其它情况的枚举成员被当作是需要计算得出的值。


常数枚举

常数枚举是使用 const enum 定义的枚举类型:

const enum Directions {Up,Down,Left,Right
}let directions = [Directions.Up, Directions.Down, Directions.Left, Directions.Right];

常数枚举与普通枚举的区别是,它会在编译阶段被删除,并且不能包含计算成员,假如包含了计算成员,则会在编译阶段报错


外部枚举

外部枚举(Ambient Enums)是使用 declare enum 定义的枚举类型:

declare enum Directions {Up,Down,Left,Right
}let directions = [Directions.Up, Directions.Down, Directions.Left, Directions.Right];

外部枚举与声明语句一样,常出现在声明文件中

同时使用 declare 和 const 也是可以的:

declare const enum Directions {Up,Down,Left,Right
}let directions = [Directions.Up, Directions.Down, Directions.Left, Directions.Right];

TypeScript入门-枚举相关推荐

  1. TypeScript入门教程 之 枚举 Enums

    TypeScript入门教程 之 枚举 Enums 枚举是一种组织相关值集合的方法.许多其他编程语言(C / C#/ Java)具有enum数据类型,而JavaScript没有.但是,TypeScri ...

  2. Typescript - enum 枚举类型(数值型枚举 / 字符串枚举 / 常量枚举 / 异构枚举 / 计算枚举成员 / 联合枚举和枚举成员类型 / 运行时的枚举 / 环境枚举 / 对象与枚举)教程

    前言 Enums(枚举)是 TypeScript 的少数功能之一,它不是 JavaScript 的类型级扩展,仅支持数字的和基于字符串的枚举. 使用枚举您可以定义一组带名字的常量,并且清晰地表达意图或 ...

  3. TypeScript入门笔记

    TypeScript入门笔记 第一章 TypeScript简介 1.1 TypeScript简介 TypeScript 是由微软开发的一款开源的编程语言,TypeScript 是 Javascript ...

  4. 我写的第一本书《TypeScript 入门教程》

    阅读原文 持续了大半年的学习和写作,在今天终于告一段落了. 写书之旅 最初有写书的想法,是刚加入微软的时候. 由于工作中需要重度使用 TypeScript,所以我花了几天的时间研读了好几遍官方手册和中 ...

  5. TypeScript入门教程 之 classes-emit

    TypeScript入门教程 之 classes-emit What's up with the IIFE 为该类生成的js可能是: function Point(x, y) {this.x = x; ...

  6. TypeScript入门教程 之 箭头函数

    TypeScript入门教程 之 箭头函数 亲切地称为粗箭头(因为->是细箭头并且=>是粗箭头),也被称为lambda函数(由于其他语言).另一个常用功能是胖箭头功能()=>some ...

  7. TypeScript入门教程 之 类/抽象类/构造器/Getter/Setter

    TypeScript入门教程 之 类/抽象类/构造器/Getter/Setter 将JavaScript中的类作为头等项很重要的原因是: 类提供了有用的结构抽象 为开发人员提供一种一致的方式来使用类, ...

  8. TypeScript入门教程 之 const

    TypeScript入门教程 之 const const是ES6 / TypeScript提供的非常受欢迎的功能.它使您可以与变量保持不变.从文档以及运行时的角度来看,这都是很好的.要使用const只 ...

  9. TypeScript入门教程 之 解构

    TypeScript入门教程 之 解构 TypeScript支持以下形式的解构(以解构的名义命名,即分解结构): 对象分解 阵列解构 人们很容易将解构视为结构的逆.JavaScript中的结构化方法是 ...

最新文章

  1. optee内核中malloc函数的原理介绍
  2. C#中的DateTime:本周,本月,今年,本周
  3. Java 线程多线程编程3---线程同步之生产者与消费者问题
  4. Speedment 3.0的新功能
  5. idea允许多实例运行
  6. 【手写数字识别】基于matlab GUI BP神经网络手写数字识别【含Matlab源码 1118期】
  7. git学习笔记-(13-reset三部曲)
  8. cartographer 3D点云建图教程
  9. 第三方支付-手续费系统设计与实现
  10. 思科/华为计算机网络工程师,软考网络工程师华为、思科指令大全
  11. LeetCode刷题笔记一:(两数之和)
  12. 智能存储 | 版权保护解决方案
  13. 化云为雨,华为云为什么要深入经济的“毛细血管”?
  14. Centos7 快捷键调节屏幕亮度
  15. C# 添加Word页眉、页脚和页码
  16. 几个实际工作中测出来的web安全漏洞
  17. 国产直流马达驱动芯片SS6216的功能参数以及应用
  18. css3之[2D转化,动画,3D转化] 彩蛋之3D立方体
  19. python自动读取邮件_Python3读取邮件内容
  20. python单位转换编程英寸厘米_第一个Python程序的单位转换,python,换算

热门文章

  1. java面试题-精心准备
  2. tensorflow综合示例7:LeNet-5实现mnist识别
  3. 彻底理解Python中的yield
  4. Spark Java API:broadcast、accumulator
  5. ansible基础配置
  6. HttpContext 来源(System.Web.HttpContext.Current值为null的问题)
  7. linux 启动流详解
  8. linux IP 命令使用举例
  9. js原生图片拼图Demo
  10. AndroidManifest.xml文件详解(application)