如何在 TypeScript 中合并 2 个枚举
要合并 2 个枚举:
- 使用扩展语法将枚举合并到一个对象中。
- 获取对象的类型。
- 使用括号表示法访问类型上两个枚举的成员。
// ✅ For STRING Enums
enum Sizes1 {
Small = 'S',
Medium = 'M',
}
enum Sizes2 {
Large = 'L',
ExtraLarge = 'XL',
}
export const Sizes = { ...Sizes1, ...Sizes2 };
// 👇️ {Small: 'S', Medium: 'M', Large: 'L', ExtraLarge: 'XL'}
console.log(Sizes);
export type Sizes = typeof Sizes;
// ✅ 现在我们可以访问两个枚举的属性
type XL = Sizes['ExtraLarge'];
type S = Sizes['Small'];
TypeScript 中的枚举是真实的对象并且存在于运行时,因此我们可以使用扩展语法 (...)
将 2 个枚举合并为一个对象。
合并对象的所有规则都适用 - 如果两个枚举中都存在一个键,则后者的值包含在最终对象中。
我们使用 typeof
运算符来获取对象的类型,现在可以使用括号表示法来访问两个枚举的成员。
使用数字枚举时,我们应该为枚举提供一个初始值,这样我们就不会得到多个指向相同值的不同枚举键。
// ✅ For Numeric Enums
enum Sizes1 {
Small = 0,
Medium,
}
enum Sizes2 {
Large = 2,
ExtraLarge,
}
export const Sizes = { ...Sizes1, ...Sizes2 };
// 👇️ {Small: 'S', Medium: 'M', Large: 'L', ExtraLarge: 'XL'}
console.log(Sizes);
export type Sizes = typeof Sizes;
type XL = Sizes['ExtraLarge'];
type S = Sizes['Small'];
第一个枚举的初始值为 0,第二个枚举的初始值为 2。这样我们就不会得到指向相同值的多个键的冲突。
请注意,如果我们使用 const
枚举,上面的示例将不起作用,因为 const
枚举只能使用常量枚举表达式,并且在编译期间被完全删除。
相关文章
在 AngularJs 中设置 Select From Typescript 的默认选项值
发布时间:2023/04/14 浏览次数:78 分类:Angular
-
本教程提供了在 AngularJs 中从 TypeScript 中设置 HTML 标记选择的默认选项的解释性解决方案。
在 Angular 中使用 TypeScript 的 getElementById 替换
发布时间:2023/04/14 浏览次数:153 分类:Angular
-
本教程指南提供了有关使用 TypeScript 在 Angular 中替换 document.getElementById 的简要说明。这也提供了在 Angular 中 getElementById 的最佳方法。
在 TypeScript 中使用 try..catch..finally 处理异常
发布时间:2023/03/19 浏览次数:181 分类:TypeScript
-
本文详细介绍了如何在 TypeScript 中使用 try..catch..finally 进行异常处理,并附有示例。
在 TypeScript 中使用 declare 关键字
发布时间:2023/03/19 浏览次数:97 分类:TypeScript
-
本教程指南通过特定的实现和编码示例深入了解了 TypeScript 中 declare 关键字的用途。
在 TypeScript 中 get 和 set
发布时间:2023/03/19 浏览次数:172 分类:TypeScript
-
本篇文章演示了类的 get 和 set 属性以及如何在 TypeScript 中实现它。
在 TypeScript 中格式化日期和时间
发布时间:2023/03/19 浏览次数:161 分类:TypeScript
-
本教程介绍内置对象 Date() 并讨论在 Typescript 中获取、设置和格式化日期和时间的各种方法。
在 TypeScript 中返回一个 Promise
发布时间:2023/03/19 浏览次数:182 分类:TypeScript
-
本教程讨论如何在 TypeScript 中返回正确的 Promise。这将提供 TypeScript 中 Returns Promise 的完整编码示例,并完整演示每个步骤。
在 TypeScript 中定义函数回调的类型
发布时间:2023/03/19 浏览次数:221 分类:TypeScript
-
本教程说明了在 TypeScript 中为函数回调定义类型的解决方案。为了程序员的方便和方便,实施了不同的编码实践指南。