在JavaScript中仿真Java的enum

老码农

发布于 2018-06-27 10:35:44

2.3K0

发布于 2018-06-27 10:35:44

背景

最近开始做的一个项目使用facebook的ReactJS前端框架。发现经常使用react的keyMirror工具来定义一些枚举常量：

var keyMirror = require('keyMirror');
var AppMode = keyMirror({
    LOG_IN: null,
    SIGN_UP: null
});
module.exports = AppMode;

其他JS代码对该枚举的引用大概如下代码：

var AppMode = require('../const/app_mode');

if (curMode == AppMode.LOG_IN) {
    ...
} else {
    ...
}
...

var className = (curMode == AppMode.LOG_IN) ? 'login-form' : 'signup-form';
...

这样的代码感觉还行，起码比字串漫天飞舞的情况好很多。不过我发现诸如curMode == AppMode.LOG_IN类型的代码太多了，写起来不太舒服，而且总是要求我require('../const/app_mode')，我希望能简单地写类似于curMode.isLogIn()的代码。所以就搞了这个简单的工具gen_enum：

用法

npm install gen_enum

var createEnum = require('gen_enum');
var COLORS = createEnum("blue red");
var myColor = COLORS.blue;
console.log(myColor._id); // output blue
console.log(myColor.isBlue()); //output true
console.log(myColor.isRed()); //output false
console.log(myColor.name()); //output blue
console.log(myColor.toString()); //output blue

输入: "key1 key2 ..."

注意，除空白以外关键字还可以用,, ; 以及:来分割

输出:

{
    key1: {
        _id: 'key1',
        name: function() {
            return 'key1';
        },
        toString: function() {
            return 'key1';
        },
        isKey1: function() {
            return true;
        },
        isKey2: function() {
            return false;
        }
    },
    key2: {
        _id: 'key2',
        name: function() {
            return 'key2';
        },
        toString: function() {
            return 'key2';
        },
        isKey1: function() {
            return false;
        },
        isKey2: function() {
            return true;
        }
    }
}

其他输入形式

使用字串来指定枚举关键字只是一种方式，gen_enum还支持其他两种形式的输入：

// 用字串数组来指定枚举关键字
var Color = genEnum("blue", "red");
var myColor = Color.blue;

// 用Object对象来指定枚举关键字
var WeekDay = genEnum({
    Monday: null,
    Tuesday: null
})
var myDay = WeekDay.Monday;

关于 CamelCase

gen_enum将大写加下划线的枚举关键字的isXXX函数名转换为CamelCase形式：

var AppMode = genEnum('SIGN_UP, LOG_IN, FORGOT_PASSWORD');
var curMode = AppMode.LOG_IN;
console.log(curMode.isLogIn()); // 输出 true
console.log(curMode.isSignUp()); // 输出 false
console.log(curMode.isForgotPassword()); // 输出 false

关于只读（Immutability）

gen_enum使用Object.freeze来锁定返回的枚举结构。如果环境（IE8或更早的版本）不支持Object.freeze，则返回的枚举结构不具备只读特性。

项目地址：

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

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

react

javascript

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

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

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

react

javascript

登录后参与评论

0 条评论

热度