以下内容是否会使对象满足枚举在JavaScript中的所有特性？类似于：
my.namespace.ColorEnum = {
RED : 0,
GREEN : 1,
BLUE : 2
}
// later on
if(currentColor == my.namespace.ColorEnum.RED) {
// whatever
}
还是有其他方法可以做到这一点？
当前回答
这是Typescript将其枚举转换为Javascript的方式：
var makeEnum = function(obj) {
obj[ obj['Active'] = 1 ] = 'Active';
obj[ obj['Closed'] = 2 ] = 'Closed';
obj[ obj['Deleted'] = 3 ] = 'Deleted';
}
Now:
makeEnum( NewObj = {} )
// => {1: "Active", 2: "Closed", 3: "Deleted", Active: 1, Closed: 2, Deleted: 3}
起初我很困惑obj[1]为什么返回“Active”，但后来意识到它的死简单赋值运算符赋值，然后返回：
obj['foo'] = 1
// => 1
其他回答
阅读了所有的答案，没有找到任何非冗长和干燥的解决方案。我使用这一行：
const modes = ['DRAW', 'SCALE', 'DRAG'].reduce((o, v) => ({ ...o, [v]: v }), {});
它生成具有人类可读值的对象：
{
DRAW: 'DRAW',
SCALE: 'SCALE',
DRAG: 'DRAG'
}
使用Javascript代理
TLDR：将这个类添加到实用程序方法中，并在整个代码中使用它，它模拟了传统编程语言中的Enum行为，当您尝试访问不存在的枚举器或添加/更新枚举器时，实际上会抛出错误。无需依赖Object.creeze（）。
class Enum {
constructor(enumObj) {
const handler = {
get(target, name) {
if (typeof target[name] != 'undefined') {
return target[name];
}
throw new Error(`No such enumerator: ${name}`);
},
set() {
throw new Error('Cannot add/update properties on an Enum instance after it is defined')
}
};
return new Proxy(enumObj, handler);
}
}
然后通过实例化类创建枚举：
const roles = new Enum({
ADMIN: 'Admin',
USER: 'User',
});
完整解释：
从传统语言中获得的Enum的一个非常有益的特性是，如果您试图访问不存在的枚举器，它们就会爆炸（引发编译时错误）。
除了冻结模拟枚举结构以防止意外/恶意添加附加值之外，其他答案都没有解决枚举的固有特性。
正如您可能知道的，在JavaScript中访问不存在的成员只会返回undefined，不会破坏代码。由于枚举数是预定义的常量（即一周中的几天），因此不应出现枚举数未定义的情况。
不要误解我的意思，JavaScript在访问未定义的财产时返回未定义的行为实际上是语言的一个非常强大的功能，但当您试图模拟传统Enum结构时，这并不是您想要的功能。
这是代理对象发光的地方。随着ES6（ES2015）的引入，代理被标准化为语言。以下是MDN的描述：
Proxy对象用于定义基本操作（例如属性查找、赋值、枚举、函数）的自定义行为调用等）。
与web服务器代理类似，JavaScript代理能够拦截对象上的操作（使用“陷阱”，如果您愿意，可以将其称为钩子），并允许您在操作完成之前执行各种检查、操作和/或操作（或者在某些情况下完全停止操作，这正是我们在尝试引用不存在的枚举器时想要做的）。
下面是一个精心设计的示例，它使用Proxy对象来模拟Enum。本例中的枚举器是标准HTTP方法（即“GET”、“POST”等）：
//用于创建枚举的类（13行）//请随意将其添加到中的实用程序库//你的代码库和利润！注：因为代理是ES6//功能，某些浏览器/客户端可能不支持//您可能需要使用babel这样的服务进行transfile类枚举{//Enum类实例化JavaScript代理对象。//实例化“代理”对象需要两个参数，//“target”对象和“handler”。我们首先定义处理程序，//然后使用处理程序实例化代理。//代理处理程序只是一个对象，它的财产//是定义代理行为的函数//当对其执行操作时。//对于枚举，我们需要定义允许我们检查枚举器的行为//正在访问以及正在设置的枚举器。这可以通过以下方式实现//定义“get”和“set”陷阱。构造函数（enumObj）{常量处理程序={get（目标，名称）{if（目标类型[名称]！='undefined'）{返回目标[名称]}抛出新错误（`没有这样的枚举器：$｛name｝`）},设置（）{throw new Error（“定义枚举实例后无法在其上添加/更新财产”）}}//冻结目标对象以防止修改返回新代理（enumObj，处理程序）}}//现在我们有了创建Enum的通用方法，让我们创建第一个Enum！const httpMethods=新枚举({DELETE：“删除”，GET：“GET”，OPTIONS：“选项”，PATCH：“补丁”，POST:“POST”，PUT：“PUT”})//卫生检查console.log（httpMethods.DELETE）//日志“DELETE”尝试{httpMethods.delete=“删除”}捕获（e）{console.log（“错误：”，e.message）}//throws“定义Enum实例后，无法在其上添加/更新财产”尝试{console.log（httpMethods.delete）}捕获（e）{console.log（“错误：”，e.message）}//throws“没有这样的枚举器：delete”
ASIDE：代理到底是什么？
我记得当我第一次开始在任何地方看到代理这个词的时候，我很长一段时间都觉得它毫无意义。如果你现在是这样的话，我认为概括代理的一个简单方法是将它们视为软件、机构，甚至是充当两个服务器、公司或人员之间的中间人或中间人的人。
这是Typescript将其枚举转换为Javascript的方式：
var makeEnum = function(obj) {
obj[ obj['Active'] = 1 ] = 'Active';
obj[ obj['Closed'] = 2 ] = 'Closed';
obj[ obj['Deleted'] = 3 ] = 'Deleted';
}
Now:
makeEnum( NewObj = {} )
// => {1: "Active", 2: "Closed", 3: "Deleted", Active: 1, Closed: 2, Deleted: 3}
起初我很困惑obj[1]为什么返回“Active”，但后来意识到它的死简单赋值运算符赋值，然后返回：
obj['foo'] = 1
// => 1
更新05.11.2020：修改为包含静态字段和方法，以更接近地复制“true”枚举行为。
是否有人尝试过使用包含私有字段和“get”访问器的类执行此操作？我意识到私有类字段目前仍处于实验阶段，但它似乎可以用于创建具有不可变字段/财产的类。浏览器支持也不错。唯一不支持它的“主要”浏览器是Firefox（我相信他们很快就会支持）和IE（谁在乎）。
免责声明：我不是一个开发者。我只是在寻找这个问题的答案，并开始思考我有时如何通过创建带有私有字段和受限属性访问器的类来在C#中创建“增强”枚举。
样本类别
class Sizes {
// Private Fields
static #_SMALL = 0;
static #_MEDIUM = 1;
static #_LARGE = 2;
// Accessors for "get" functions only (no "set" functions)
static get SMALL() { return this.#_SMALL; }
static get MEDIUM() { return this.#_MEDIUM; }
static get LARGE() { return this.#_LARGE; }
}
现在您应该可以直接调用enums。
Sizes.SMALL; // 0
Sizes.MEDIUM; // 1
Sizes.LARGE; // 2
使用私有字段和有限访问器的组合意味着枚举值得到了很好的保护。
Sizes.SMALL = 10 // Sizes.SMALL is still 0
Sizes._SMALL = 10 // Sizes.SMALL is still 0
Sizes.#_SMALL = 10 // Sizes.SMALL is still 0
在我看来，枚举是什么？它是一个不可变的对象，总是可以访问，您可以相互比较项目，但项目具有通用的财产/方法，但对象本身或值不能更改，它们只能实例化一次。
枚举用于比较数据类型、设置、采取/回复的操作等。
为此，您需要具有相同实例的对象，以便您可以检查它是否为枚举类型if（something instanceof enum）此外，如果您获得了一个枚举对象，则无论枚举类型如何，它都应该以相同的方式进行响应。
在我的例子中，它比较数据类型的值，但它可以是任何东西，从在3d游戏中修改面向方向的块到将值传递到特定的对象类型注册表。
请记住，它是javascript，不提供固定的枚举类型，您最终总是自己实现，正如本线程所示，有很多实现都不正确。
这是我用于枚举的内容。由于枚举是不可变的（或者至少应该是呵呵），所以我冻结了对象，这样它们就不容易被操作了。
枚举可以由EnumField.STRING使用，并且它们有自己的方法来处理它们的类型。要测试是否有东西传递给对象，可以使用if（somevar instanceof EnumFieldSegment）
这可能不是最优雅的解决方案，我愿意改进，但这种类型的不可变枚举（除非你解冻它）正是我需要的用例。
我也意识到我可以用｛｝重写原型，但我的大脑在这种格式下工作得更好；-）向我开枪。
/**
* simple parameter object instantiator
* @param name
* @param value
* @returns
*/
function p(name,value) {
this.name = name;
this.value = value;
return Object.freeze(this);
}
/**
* EnumFieldSegmentBase
*/
function EnumFieldSegmentBase() {
this.fieldType = "STRING";
}
function dummyregex() {
}
dummyregex.prototype.test = function(str) {
if(this.fieldType === "STRING") {
maxlength = arguments[1];
return str.length <= maxlength;
}
return true;
};
dummyregexposer = new dummyregex();
EnumFieldSegmentBase.prototype.getInputRegex = function() {
switch(this.fieldType) {
case "STRING" : return dummyregexposer;
case "INT": return /^(\d+)?$/;
case "DECIMAL2": return /^\d+(\.\d{1,2}|\d+|\.)?$/;
case "DECIMAL8": return /^\d+(\.\d{1,8}|\d+|\.)?$/;
// boolean is tricky dicky. if its a boolean false, if its a string if its empty 0 or false its false, otherwise lets see what Boolean produces
case "BOOLEAN": return dummyregexposer;
}
};
EnumFieldSegmentBase.prototype.convertToType = function($input) {
var val = $input;
switch(this.fieldType) {
case "STRING" : val = $input;break;
case "INT": val==""? val=0 :val = parseInt($input);break;
case "DECIMAL2": if($input === "" || $input === null) {$input = "0"}if($input.substr(-1) === "."){$input = $input+0};val = new Decimal2($input).toDP(2);break;
case "DECIMAL8": if($input === "" || $input === null) {$input = "0"}if($input.substr(-1) === "."){$input = $input+0};val = new Decimal8($input).toDP(8);break;
// boolean is tricky dicky. if its a boolean false, if its a string if its empty 0 or false its false, otherwise lets see what Boolean produces
case "BOOLEAN": val = (typeof $input == 'boolean' ? $input : (typeof $input === 'string' ? (($input === "false" || $input === "" || $input === "0") ? false : true) : new Boolean($input).valueOf())) ;break;
}
return val;
};
EnumFieldSegmentBase.prototype.convertToString = function($input) {
var val = $input;
switch(this.fieldType) {
case "STRING": val = $input;break;
case "INT": val = $input+"";break;
case "DECIMAL2": val = $input.toPrecision(($input.toString().indexOf('.') === -1 ? $input.toString().length+2 : $input.toString().indexOf('.')+2)) ;break;
case "DECIMAL8": val = $input.toPrecision(($input.toString().indexOf('.') === -1 ? $input.toString().length+8 : $input.toString().indexOf('.')+8)) ;break;
case "BOOLEAN": val = $input ? "true" : "false" ;break;
}
return val;
};
EnumFieldSegmentBase.prototype.compareValue = function($val1,$val2) {
var val = false;
switch(this.fieldType) {
case "STRING": val = ($val1===$val2);break;
case "INT": val = ($val1===$val2);break;
case "DECIMAL2": val = ($val1.comparedTo($val2)===0);break;
case "DECIMAL8": val = ($val1.comparedTo($val2)===0);break;
case "BOOLEAN": val = ($val1===$val2);break;
}
return val;
};
/**
* EnumFieldSegment is an individual segment in the
* EnumField
* @param $array An array consisting of object p
*/
function EnumFieldSegment() {
for(c=0;c<arguments.length;c++) {
if(arguments[c] instanceof p) {
this[arguments[c].name] = arguments[c].value;
}
}
return Object.freeze(this);
}
EnumFieldSegment.prototype = new EnumFieldSegmentBase();
EnumFieldSegment.prototype.constructor = EnumFieldSegment;
/**
* Simple enum to show what type of variable a Field type is.
* @param STRING
* @param INT
* @param DECIMAL2
* @param DECIMAL8
* @param BOOLEAN
*
*/
EnumField = Object.freeze({STRING: new EnumFieldSegment(new p("fieldType","STRING")),
INT: new EnumFieldSegment(new p("fieldType","INT")),
DECIMAL2: new EnumFieldSegment(new p("fieldType","DECIMAL2")),
DECIMAL8: new EnumFieldSegment(new p("fieldType","DECIMAL8")),
BOOLEAN: new EnumFieldSegment(new p("fieldType","BOOLEAN"))});
推荐文章
- 文档之间的区别。addEventListener和window。addEventListener?
- 如何检查动态附加的事件监听器是否存在?
- 如何写setTimeout与参数Coffeescript
- 将JavaScript字符串中的多个空格替换为单个空格
- JavaScript: override alert()
- 重置setTimeout
- 如何确保<select>表单字段被禁用时提交?
- jQuery有不聚焦的方法吗?
- 反应钩子-正确的方式清除超时和间隔
- TypeScript枚举对象数组
- 在React.js中正确的img路径
- 在React.js中更新组件onScroll的样式
- onClick ReactJS调用多个函数
- 如何在JavaScript中转义单引号(')?
- Ng-repeat结束事件
