首页 前端知识 【基础学习笔记 enum】TypeScript 中的 enum 枚举类型介绍

【基础学习笔记 enum】TypeScript 中的 enum 枚举类型介绍

2024-06-16 09:06:50 前端知识 前端哥 240 222 我要收藏

因为之前网上查好多博客都是只说最基础的,所以这里记录一下,最基础的放在最后面。

这里重点要记录的是枚举成员的值可以是字符串(字符串枚举,因为网上大部分只介绍常数枚举),需要注意的一点是,和数字值不同:字符串枚举没有自增长的行为,枚举成员必须设置初始值。

字符串枚举

默认情况下,枚举成员的值是数字,但你也可以使用字符串或混合值作为枚举成员的值。比如:

enum ErrorCode {
  NotFound = "404",
  ServerError = "500",
  Unauthorized = "401"
}

console.log(ErrorCode.NotFound);  // 输出: "404"

常数枚举

常数枚举在编译时会被移除,只保留枚举成员的值。这可以减少编译后的代码量,适用于一些只需要值而不需要名称的情况。比如:

const enum Size {
  Small = "S",
  Medium = "M",
  Large = "L"
}

let selectedSize: Size = Size.Medium;
console.log(selectedSize);  // 输出: "M"

指定枚举成员的值

在枚举成员后可以显式指定其值,未指定的情况下会默认递增。比如:

enum LogLevel {
  Error = 1,
  Warn,
  Info,
  Debug
}

let currentLogLevel: LogLevel = LogLevel.Info;
console.log(currentLogLevel);  // 输出: 3

反向映射

枚举类型在编译为 JavaScript 时会生成双向映射,可以通过枚举成员的名称获取对应的值,也可以通过值获取对应的枚举成员。比如:

enum Weekday {
  Sunday,
  Monday,
  Tuesday,
  Wednesday,
  Thursday,
  Friday,
  Saturday
}

console.log(Weekday.Sunday);  // 输出: 0
console.log(Weekday[0]);      // 输出: "Sunday"

枚举作为类型

枚举类型本身可以作为类型来使用,用于约束变量的取值范围。比如:

enum Gender {
  Male,
  Female
}

interface Person {
  name: string;
  age: number;
  gender: Gender;
}

let person: Person = {
  name: "Alice",
  age: 30,
  gender: Gender.Female
};

基本用法

基本用法如下:

enum Direction {
  Up,
  Down,
  Left,
  Right
}

let userDirection: Direction = Direction.Left;
console.log(userDirection);  // 输出: 2

述代码中,Direction 枚举类型定义了四个成员:Up、Down、Left 和 Right。每个成员都会被分配一个默认的数字值,从 0 开始递增。在定义枚举变量时,可以直接使用成员名称进行赋值。

由于对enum类型用的不多,所以记录一下学习。

网上关于enum类型的说明都差不多,无非是定义的枚举成员的默认值从零开始递增,如果指定了数值就从指定的数值开始递增。在使用枚举类型时,可以像使用普通类型一样声明变量并赋予其枚举值。

在 TypeScript 中,可以使用 enum 关键字来定义枚举类型(enumeration types)。枚举类型用于定义一组命名的常量值,使代码更加可读性强、维护性高。枚举(Enum)类型用于取值被限定在一定范围内的场景,比如性别只有男和女,某个机构的部门只有固定几个(不考虑部门整编重组的情况下)。

基本用法是枚举类型的每个成员都会被分配一个默认的数字值,从 0 开始递增。在定义枚举变量时,可以直接使用成员名称进行赋值。

希望本文对您有所帮助,也希望路过的大佬不吝赐教!

转载请注明出处或者链接地址:https://www.qianduange.cn//article/12402.html
标签
评论
发布的文章

前端开发 4: jQuery

2024-06-22 01:06:02

网页开发 HTML

2024-06-22 01:06:17

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!