注册

如何优雅的使用枚举功能——Constants

背景


在项目中,或多或少的会遇到使用枚举/快码/映射/字典,它们一般长这个样子。(PS:我不知道怎么称呼这个玩意)



在一些需要展示的地方,会使用下面的代码来展示定义。


<div>{{ statusList[status] }}</div>

而在代码中,又会使用下面的形式进行判断。这样写会让代码里充斥着许多的 'draft' 字符串,非常不利于管理。


if (status === 'draft') {
// do sth...
}

基于这种情况,在使用时会先声明一个变量。


const DRAFT = 'draft'

if (status === DRAFT) {
// do sth...
}

为了应对整个项目都会使用到的情况,会这样处理。


export const statusList = {
draft: '草稿',
pending: '待处理',
}

export const statusKeys = {
draft: 'draft',
pending: 'pending',
}

看了隔壁后端同事的代码,在 Java 里,枚举的定义及使用一般是如下形式。于是我就有了写这个工具类的想法。


public enum Status {
DRAFT('draft', '草稿');

Status(String code, String name) {
this.code = code;
this.name = name;
}

public String getCode() {
return code;
}

public String getName() {
return name;
}
}

public void aFunction() {
const draftCode = Status.DRAFT.getCode();
}

Constants


直接上代码


const noop = () => {}

class Constants {
constructor(obj) {
Object.keys(obj).forEach((key) => {
const initValue = obj[key];
if (initValue instanceof Object) {
console.error(`Warnning: this util only support primitive values, current value is ${JSON.stringify(initValue)}`)
// throw new Error(`Warnning: this util only support primitive values, current value is ${JSON.stringify(initValue)}`)
}
const newKey = `_${key}`;
this[newKey] = initValue;
Object.defineProperty(this, key, {
configurable : true,
enumerable : true,
get: function() {
const value = this[newKey];
const constructorOfValue = value.constructor;
const entry = [key, value];
['getKey', 'getValue'].forEach((item, index) => {
constructorOfValue.prototype[item] = () => {
constructorOfValue.prototype.getKey = noop;
constructorOfValue.prototype.getValue = noop;
return entry[index];
}
})
return value;
},
set: function(newValue) {
this[newKey] = newValue;
}
})
});
}
}

测试


const testValues = {
draft: '草稿',
id: 1,
money: 1.2,
isTest: true,
testObj: {},
testArray: [],
}
const constants = new Constants(testValues)

const test = (result, expect) => {
const isExpected = result === expect
if (isExpected) {
console.log(`PASS: The result is ${result}`)
} else {
console.error(`FAIL: the result is ${result}, should be ${expect}`)
}
}

test(constants.draft, '草稿')
test(constants.draft.getKey(), 'draft')
test(constants.draft.getValue(), '草稿')

test(constants.id, 1)
test(constants.id.getKey(), 'id')
test(constants.id.getValue(), 1)

test(constants.money, 1.2)
test(constants.money.getKey(), 'money')
test(constants.money.getValue(), 1.2)

test(constants.isTest, true)
test(constants.isTest.getKey(), 'isTest')
test(constants.isTest.getValue(), true)
a = 'test'
test(a.getKey(), undefined)
test(a.getValue(), undefined)


作者:Wetoria
链接:https://juejin.cn/post/7033220309386395679

0 个评论

要回复文章请先登录注册