JavaScript 模拟枚举的实现方法与示例

作者:拾光

时间:2026-10-27

浏览:300

本文介绍在 JavaScript 中利用 JSON 对象模拟枚举的方法。通过定义常量对象,可实现整型、字符串及复杂对象类型的枚举值。文中包含 WeekDay、Node 等整型示例,以及 Color 字符串和 PersonList 复杂对象示例,并说明该方法可用于修正 IE 对 DOM 节点类型常量的支持问题。

文章目录

整型枚举的定义与验证

接下来,我们将演示如何定义名为 Week 的枚举类型。

具体代码实现如下:

if(typeof WeekDay == "undefined"){
var WeekDay = {};
WeekDay.Sunday = 0;
WeekDay.Monday = 1;
WeekDay.Tuesday = 2;
WeekDay.Wedesay = 3;
WeekDay.Thursday = 4;
WeekDay.Friday = 5;
WeekDay.Saturday = 6;
}

验证代码如下:


alert(WeekDay.Monday); // -----> Output: 1

DOM节点类型枚举的应用

此外,还有一种更为直观的枚举定义方式。我们可以参考 DOM 文档节点类型的定义方法,具体实现如下:

代码示例如下:

if(typeof Node == "undefined"){
var Node = {
ELEMENT_NODE: 1,
ATTRIBUTE_NODE: 2,
TEXT_NODE: 3,
CDATA_SECTION_NODE: 4,
ENTITY_REFERENCE_NODE: 5,
ENTITY_NODE: 6,
PROCESSING_INSTRUCTION_NODE: 7,
COMMENT_NODE: 8,
DOCUMENT_NODE: 9,
DOCUMENT_TYPE_NODE: 10,
DOCUMENT_FRAGEMENT_NODE: 11,
NOTATION_NODE: 12
}
}

验证代码如下:


代码示例如下:

alert(document.nodeType == Node.DOCUMENT_NODE); // -----> Output: true

需要注意的是,上述 Node 对象的定义方式可用于解决 Internet Explorer 浏览器不支持 DOM 节点类型常量的问题,而目前其他主流浏览器均已原生支持这些常量。

字符串与复杂对象类型枚举示例

与类 C 语言类似,上述两个示例中的枚举属性值均为整型。读者可能会好奇,是否还能定义其他类型的枚举?要解答这个问题,我们需要了解该枚举实现的底层原理。前文提到,此处使用的是 JSON 格式来构建枚举,而 JSON 支持任意类型的值。因此,JavaScript 中的枚举可以包含任何类型的值。以下以 String 类型为例进行说明:

代码示例如下:

if(typeof Color == "undefined"){
var Color = {
Color1: 'red',
Color2: 'green',
Color3: 'white',
Color4: 'black' 
} 
}

验证代码如下:


alert(Color.Color1); // -----> Output: red

为了展示更复杂的应用场景,下面定义一个名为 PersonList 的枚举,其值包含复杂的对象结构:

代码示例如下:

if(typeof PersonList == "undefined"){
var PersonList = {
ZhangSan: {
Id: 1,
Name: 'ZhangSan',
Gender: 'man'
},
LiSi: {
Id: 2,
Name: 'LiSi',
Gender: 'woman'
},
ZhaoWu: {
Id: 3,
Name: 'ZhaoWu',
Gender: 'man'
}
}
}

运行结果如下图所示:

整型枚举的定义与验证

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章