【愚公系列】《鸿蒙原生应用开发从零基础到多实战》005-TypeScript 中的枚举

愚公搬代码

发布于 2025-06-03 08:38:01

5600

代码可运行

文章被收录于专栏：历史专栏历史专栏

运行总次数：0

代码可运行

🚀前言

在现代编程中，枚举是一种非常实用的类型，它可以帮助我们管理和组织一组相关的常量，使代码更加清晰和易于维护。TypeScript作为一种静态类型语言，提供了对枚举的强大支持，使得开发者能够更有效地定义和使用常量集合。在鸿蒙原生应用开发中，掌握TypeScript中的枚举，不仅可以提升代码的可读性，还能减少出错的可能性。

本篇文章将深入探讨TypeScript中的枚举类型，包括数字枚举、字符串枚举以及异构枚举的使用方法。通过具体的实例，我们将展示如何在鸿蒙原生应用中灵活运用枚举，帮助你更好地管理应用中的状态和选项，使代码更加简洁明了。

🚀一、TypeScript 中的枚举

🔎1.枚举基础概念

定义：枚举（enum）是 TypeScript 对 JavaScript 的扩展，用于定义一组具名常量集合，支持通过名称或值双向访问，提升代码可读性。

🔎2.枚举与数组/对象的对比

特性	数组	对象	枚举
访问方式	仅通过索引 (arr[0])	键名 (obj.key)	双向访问（键名或值）
值类型	任意类型	任意类型	数字、字符串或混合类型
自动编号	不支持	不支持	支持（默认从0开始）

示例对比：

// 数组：只能通过索引访问
const arr = ['a', 'b', 'c'];
arr[0];      // ✅ 'a'
arr['a'];    // ❌ undefined

// 对象：通过键名访问
const obj = { a: 'a', b: 'b' };
obj.a;       // ✅ 'a'
obj['a'];    // ✅ 'a'

// 枚举：双向访问
enum Color { Red, Green, Blue }
Color.Green;     // ✅ 1（值）
Color[1];        // ✅ 'Green'（名称）

🔎3.枚举核心特性

🦋3.1 自动编号规则

默认从 0 开始递增
手动赋值后会基于前一项自动+1

enum Color1 { Red, Green, Blue }          // 0,1,2
enum Color2 { Red=1, Green, Blue }        // 1,2,3
enum Color3 { Red=1, Green=5, Blue=9 }    // 1,5,9

🦋3.2 反向映射（Reverse Mapping）

通过值获取键名（仅适用于数字枚举）：

enum Color4 { Red=1, Green=5, Blue=2 }
console.log(Color4[2]); // 'Blue'

🦋3.3 混合类型枚举

支持数字、字符串、计算值混合，但需注意：

计算项（如表达式、变量）后的成员必须手动赋值
字符串成员后不能自动递增

let a = '123';
enum MixedEnum {
  Num = 1,                  // 数字项
  Str = 'hello',            // 字符串项
  Computed = a.length,      // 计算项（值为3）
  MustAssign = 4            // 必须手动赋值（否则报错）
}

🦋3.4 任意值类型

通过类型断言 <any> 允许非标准值，但会破坏自动递增：

enum SpecialEnum {
  Red = 1.5,                // 小数
  Green,                    // 自动+1 → 2.5
  Blue = <any>'b'           // 字符串（需断言）
}

🔎4.注意事项与陷阱

🦋4.1 值覆盖问题

手动赋重复值时，后面的值会覆盖前面的键名：

enum OverlapEnum { A=1, B=1, C=2 }
console.log(OverlapEnum[1]); // 'B'（覆盖了A）

🦋4.2 计算项限制

计算所得项后的成员必须手动初始化：

// ✅ 合法
enum ValidEnum {
  A = 1 + 1,    // 计算项
  B = 2         // 手动赋值
}

// ❌ 错误：C没有初始化
enum InvalidEnum {
  A = '123'.length,  // 计算项（值为3）
  B                  // Error: Enum member must have initializer
}

🦋4.3 字符串枚举特性

无反向映射
后续成员必须手动赋值

enum StringEnum {
  A = 'Apple',
  B = 'Banana',
  // C  // ❌ 必须赋值
}

🔎5.最佳实践

优先数字枚举需要反向映射时使用数字枚举，否则考虑字符串枚举（更直观）。

避免重复值防止反向映射时键名被覆盖。

显式赋值混合类型时明确所有值，减少自动递增导致的意外行为。

常量枚举优化使用 const enum 提升性能（编译时内联值）：

const enum OptimizedEnum { A=1, B=2 }
console.log(OptimizedEnum.A); // 编译后直接输出1

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2025-02-28，如有侵权请联系 cloudcommunity@tencent.com 删除

字符串

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度