需求背景

用户注册时，会取拼音作为id。起初使用的全大写，后续由于业务要求，展示改为全小写。
由于数据 -> 用户，会有许多中间层，部分中间层全转为小写，部分没有处理，而服务端也会做相同的处理。

导致请求key为[‘abc’, ‘EFF’]，响应key为[‘abc’, ‘eff’]。

诉求

数据源为

const userInfo = {
    'nihao': {name: '你好'},
    'XIEXIE': {name: '谢谢'},
}

// 可能得key
const key1 = ['nihao', 'xiexie'];
const key2 = ['NIHAO', 'XIEXIE'];
const key3 = ['NIHAO', 'xiexie'];
const key3 = ['nihao', 'XIEXIE'];

期望

key1.forEach(name => {
    console.log(userInfo[name]);
});
// key2...
// key3...

// 输出均为
// {name: '你好'}
// {name: '谢谢'}

实现

数据的key要么是全大写，要么是全小写

暴力简单版

只需要把数据所有的key，大小写都写上，就完事了！讲究的就是一个暴力。

const newUserInfo = {};
Object.keys(userInfo).forEach(name => {
    newUserInfo[name.toLowerCase()] = userInfo[name];
    newUserInfo[name.toUpperCase()] = userInfo[name];
})

方法获取版

写个方法，获取的时候，对key做一下大小写转换即可。

const getObjKey = (obj, key) => {
    return obj[key.toLowerCase()] || obj[key.toUpperCase()]
}

proxy版

上一个版本会导致取值还需要额外调用方法，使用代理的方式可以优雅的处理

const newUserInfo = new Proxy(
    {},
    {
        get: function (target, key: string) {
            return target[key] || target[key.toLowerCase()];
        },
        set: function (target, key: string, value: any) {
            target[key.toLowerCase()] = value;
            return value;
        },
    }
);
Object.keys(userInfo).forEach(name => {
    newUserInfo[key] = userInfo[name];
})

至此我的遇到的问题已经完全解决啦，但是这个方法并不完善，尤其是在写proxy的时候，在设置属性为大小写混合时，仅仅使用toLowerCase或者toUpperCase是取不到的，所以在set方法里加上了设置属性时强转为全小写。所以取值时也按照全小写取就好啦。

todo

今天周五！不卷了！回家休息！ 给休息好的自己留个作业~

期望对象key为大小写混排时，也能不区分大小写都取到，如果匹配到多个，则返回数组，匹配到单个，返回原始数据。

const userInfo = {
    'niHao': {name: '你好'},
    'xieXie': {name: '谢谢'},
    'XieXie': {name: '谢谢1'},
}
// userInfo.nihao -> {name: '你好'}
// userInfo.xiexie -> [{name: '谢谢'},{name: '谢谢1'}]

原文链接：https://juejin.cn/post/7351614051363373119 作者：小气小憩