[TOC] >[success] # 枚举（Enum） 本章节讲一下 **枚举（Enum）** ，**枚举（Enum）** 对于 **前端开发者** 也是一个全新的概念，它非常好理解，在 **js** 中有 **常量（ const）** ，**常量（ const）** 是指在**执行程序中，不会改变的值** ，在 **js** 中我们会用 **const 声明常量** ，但是 **有些取值是在一定范围内的一系列的常量，比如说我们一周内的七天（周一到周日），三原色（红、黄、蓝），四个方位（上、下、左、右）** 等等，这些值就可以用 **枚举（Enum）** 来表示。 >[success] ## 数字枚举（Enum） 1. **数字枚举（Enum）举例** **枚举（Enum）** 成员会被 **赋值成 0 开始 ，自动递增的一个数字** ，**Up** 是 **0** ， **Down** 是 **1** **index.ts** ~~~ enum Direction { Up, Down, Left, Right } console.log(Direction.Up) // 0 console.log(Direction[0]) // Up ~~~ **枚举（Enum）** 就像一个双向映射一样，可以用 **数组** 来 **取枚举成员的属性字符串** ，用 **对象来取枚举成员的值** 。 **编译后** ： 编译成 **js文件** 就是下面这样，首先是一个**自执行函数** ，封装了自己的一个 **作用域** ，其中 **Direction["Up"] = 0** 是用来 **自我解释** ，它会将 **Direction["Up"] = 0** 中的 **0** ，设为 **Direction[0] = "Up"** 的 **索引** ~~~ var Direction; (function (Direction) { Direction[Direction["Up"] = 0] = "Up"; Direction[Direction["Down"] = 1] = "Down"; Direction[Direction["Left"] = 2] = "Left"; Direction[Direction["Right"] = 3] = "Right"; })(Direction || (Direction = {})); console.log(Direction.Up); // 0 console.log(Direction[0]); // Up ~~~ 2. **值递增** 如果 **给枚举成员赋一个 number 值** ，它会 **从赋值这个成员开始向后递增数字** ，如下代码： **index.ts** ~~~ enum Direction { Up, // 0 Down = 10, // 10 Left, // 11 Right // 12 } console.log(Direction.Down) // 10 console.log(Direction[2]) // undefined ~~~ 上面 **Direction[2]** 为什么会是 **undefined** 呢？正常情况下 **0 是 Up** 、 **1 是 Down** 、 **2 是 Left** ， 因为 **Down** 被 **赋值成 10** ，也就是说**Down** 的 **索引是 10** ，**Left** 的 **索引** 应该是 **11** ，要这样写 **console.log(Direction[11])** 才能打印出 **Left** >[success] ## 字符串枚举（Enum） **字符串枚举** 就是 **给它每一项都加一个字符串的值** ， **不可以有的成员有字符串值，有的成员没有字符串值** ， **字符串枚举** 可以用来做一个 **简单的字符串的比较** ，如下： **index.ts** ~~~ enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用来做判断 if(value === Direction.Up){ console.log('go Up!') } ~~~ >[success] ## 常量枚举（Enum） **常量枚举（Enum）** 可以**提升性能** ，因为 **Typescript 文件** 在编译后， **枚举（Enum）** 会 **多出来一大堆的代码** ，那是不是所有的 **Enum** 都可以使用 **常量枚举** 呢， **答案是否定的** ， **枚举的值有 2 种类型** ，一种是 **常量（cosnt）值** ，一种是 **计算（computed）值** ，**只有常量值可以进行常量枚举** ，我们这里举例的都是 **常量值** ， **计算值** 我们后期会讲到。 1. **未用const 的 枚举（Enum）** **index.ts** ~~~ enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用来做判断 if(value === Direction.Up){ console.log('go Up!') } ~~~ **编译之后成 js 文件 之后** ~~~ var Direction; (function (Direction) { Direction["Up"] = "UP"; Direction["Down"] = "DOWN"; Direction["Left"] = "LEFT"; Direction["Right"] = "RIGHT"; })(Direction || (Direction = {})); var value = 'UP'; // 用来做判断 if (value === Direction.Up) { console.log('go Up!'); } ~~~ 2. **用 const 的 枚举（Enum）** ~~~ const enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用来做判断 if(value === Direction.Up){ console.log('go Up!') } ~~~ **编译之后成 js 文件 之后** ~~~ var value = 'UP'; // 用来做判断 if (value === "UP" /* Up */) { console.log('go Up!'); } ~~~