TS 枚举转化为数组

原创

已于 2024-05-15 11:35:25 修改 · 1.4k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #开发语言 #typescript

于 2024-05-15 11:33:12 首次发布

1. 枚举使用

const RED = 1;
const GREEN = 2;
const BLUE = 3;

在 JS 中大量定义变量的操作很繁琐，因此 TypeScript 设计了 Enum 结构。

Enum 结构特别之处在于，它既是一种类型，也是一个值。

大部分 TypeScript 语法都是类型语法，编译后会被删除，但是 Enum 是一个值，编译后会变成 JavaScript 对象，反而会留在代码中。

枚举的简单使用：

Enum 成员默认无需赋值，系统会从零开始逐一递增，按照顺序赋值，比如 0、1、2……

enum Color {
  Red,     
  Green,   
  Blue 
}
// 等同于
enum Color {
  Red = 0,
  Green = 1,
  Blue = 2
}
// 编译后
let Color = {
  Red: 0,
  Green: 1,
  Blue: 2
};
let value:Color = Color.Red; // 0

也可以显示给 Enum 指定值，成员可以赋任何联系的值，除了 Bigint 类型。

enum Color {
  Red = 10,
  Green = 12,
  Blue = 14
}
enum Color {
  Red = 'Red',
  Green = 'Green',
  Blue = 'Blue'
}

注意：Enum 成员值均是只读的，不能重新赋值，否则报错。通常会在 enum 前面加上const修饰，表示这是常量。

const enum Color {
  Red,
  Green,
  Blue
}

最低0.47元/天解锁文章

200万优质内容无限畅学

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

代码里的小猫咪

关注关注

23
点赞
踩
4

收藏

觉得还不错? 一键收藏
2
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

TS安装、TS八大基础类型、TS元组、枚举和断言

qq_37635012的博客

05-27

1022

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

【起步必看】TypeScript基础

XSL_HR的博客

09-27

913

【TypeScript 起步必看】TS初学基础知识了解

2 条评论您还未登录，请先登录后发表或查看评论

4、详细版易学版TypeScript - 元组枚举

EchoLiner的博客

05-10

1416

去魔数化：一旦有个数值改动，不用再全局替换匹配。定义一体化：枚举值和枚举描述写在了一起，不分散。语义化：可以直观通过值推导出含义，例如，通过。使用方便：无需额外的过滤器，就可以通过。我们就可以大概猜出含义。

【TS】enum 枚举（含数字枚举转数组方法）

qq_45677671的博客

09-16

1万+

枚举的功能类似于字面量类型+联合类型组合的功能，也可以表示一组明确的可选值。数字枚举: 枚举成员的值为数字的枚举。字符串枚举：枚举成员的值是字符串。

常用数组方法、字符串方法、数组 ↔ 字符串的转换、TS类型提示（大全）

热门推荐

ll_883963的博客

07-05

1万+

TypeScript是一种由微软开发的自由和开源的编程语言。它是 JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。js 有的 ts 都有，所有js 代码都可以在 ts 里面运行。ts 支持类型支持，ts = type +JavaScript。ts 完全支持 js ，可以直接转换jsts动态编程语言静态编程语言边解释边执行，错误只有在运行的时候才能发现先编译再执行，在写的时候就会发现错误了（ts不能直接执行，需要先编译成 js ）

ts项目的创建以及ts基础

wythhhhh的博客

08-17

743

for...in... 一般用来遍历对象，遍历的是key，且key为string，对于单数组对应的key便是数组的下标

ts实现对象转为数组

weixin_45121510的博客

06-23

4503

let envTypeOptions_:any=[]; let envOptions_:any={ isA:'腾讯', isB:'微博', isC:'朋友圈' }； Object.keys(envOptions_).forEach(function(key:string){ envTypeOptions_.push({ value:key, label:envOptions_[key] }); })

typeScript的枚举类型和数组类型的使用和实例(推荐阅读)

hsany330的专栏

11-03

3338

枚举类型通过以下语法可以**定义**新的枚举类型： enum T { ... } 其中 `T` 是任意定义的名字，省略号 `...` 表示可以定义一个或多个可以显式初始化的**枚举值**。如： enum Direction { Up, // 值默认为 0 Down, // 值默认为 1 Left, // 值默认为 2 Right // 值默认为 3 } 上述语句定义了新的枚举类型关键字 `Direction`，现在可以用这个关键字声明新的枚举类型： // 声明d为枚举类型Di

TS-枚举元组

qq_41709082的博客

07-22

2052

TS-枚举元组 1.枚举: enum enum 类型是对 JS 数据类型的一个补充。 // 任意值这种写法只能指定最后一个 enum Color4 {red,green,blue=<any>'a'}; Color4.bule; // 'a' enum Color4 {red=<any>'a',green,blue}; //e...

枚举的基本用法（声明、取值、遍历、枚举转数组、枚举转字符串）

pig_pig32的博客

12-14

1718

因为枚举的遍历比较特殊，会把枚举的名称和值一起输出，所以在使用时，我们要根据自己的使用场景转换成自己需要的类型。

TS基础 —— 枚举

weixin_41387874的博客

02-15

2432

枚举简介枚举是一个键值对的形式，可以看成是JavaScript中的JSON对象一样。 TS使用 enum 关键词声明枚举。如何创建一个枚举，以数字枚举举例使用enum关键词，关键词后接枚举的名称，然后创建一个大括号块，并在这个块里指定枚举成员。 enum Direction{ North = 1, East, //默认递增，所以值是2 South, //值是3 West, //值是4 }; 数字枚举数字枚举的成员都是number类型的。对于...

TypeScript基础知识（3）数组类型元组类型枚举类型

m0_51207602的博客

02-14

1012

数组类型常见写法 const arr1:Array<number> = [1,2,3]//表示纯数字组成的类型 const arr2:number[] = [1,2,3]//元素类型表示，同样表示纯数字组成的类型这样的优势是什么？我们来看下下面的例子 function sum(...args){ //判断是不是每个成员都是数字 return args.reduce((prev,current)=>prev+current,0) } 我们需要判断…arg每个成员是不

7.13 ts枚举和元组

web

07-13

595

枚举和元组枚举（enum）类型元组枚举（enum）类型出现原因：数组不能通过值获取，而对象不能通过下标获取值 var arr = ['a','b','c']; arr['a'] // error var obj = {a:'a',b:'b'}; obj[0] //error enum Color {Red,Green,Blue} let c = Color.Green // 1 默认值0 数值默认间隔1，如果是其他的类型，则先转换成数值，如果不能转换成数值，没赋值的则会报错 //默认赋值 e

TypeScript类型(数字、字符串、字面量、数组、元组、枚举、对象等)

一起coding，一起嗨。

12-09

1323

【代码】TypeScript类型(数字、字符串、字面量、数组、元组、枚举、对象等)

C#笔记之枚举转换

qq_43815828的博客

07-03

884

，，，

ts定义数组定义数组

04-12

### TypeScript 中数组的定义方式在 TypeScript 中，可以通过多种方式定义数组。以下是几种常见的定义方法： #### 方法一：使用类型标注 `T[]` 这是最常见的方式之一，通过指定数组中元素的具体类型来定义数组。例如： ```typescript let stringArray: string[] = ["apple", "banana"]; // 字符串类型的数组 let numberArray: number[] = [1, 2, 3]; // 数字类型的数组 ``` 这种方式简单直观，适用于大多数场景[^5]。 #### 方法二：使用泛型语法 `Array<T>` 另一种定义数组的方法是利用 TypeScript 的泛型特性，显式声明数组为 `Array<T>` 类型。例如： ```typescript let stringArray: Array<string> = ["hello", "world"]; let numberArray: Array<number> = [10, 20]; ``` 这种方法与第一种功能相同，但在某些复杂场景下可能更清晰[^5]。 #### 方法三：多维数组对于需要处理嵌套数据结构的情况，可以定义多维数组。例如二维数组可通过 `T[][]` 形式表示： ```typescript let matrix: number[][] = [ [1, 2], [3, 4] ]; console.log(matrix); ``` 这里展示了如何创建并初始化一个二维数字数组[^1]。 #### 方法四：联合类型数组如果希望数组中的元素具有不同的类型，则可采用联合类型定义该数组： ```typescript let mixedArray: (string | number)[] = [1, "two", 3, "four"]; ``` #### 方法五：接口配合泛型定义复杂数组当数组内的项目本身较为复杂时（比如对象），则推荐结合接口和泛型一起使用。下面是一个例子展示如何构建包含特定字段的对象数组： ```typescript interface Person { name: string; age?: number; } let people: Person[] = [{name:"Alice"},{name:"Bob",age:27}]; ``` 此外还有更加灵活的例子涉及到了自定义泛型接口的应用案例[^4]。以上就是在 TypeScript 中定义不同类型数组的主要手段总结。问题

TS 枚举 转化为 数组

1. 枚举使用

TS 枚举转化为数组