如何规范化具有特殊字符属性的 JS 对象

Question

大家好，我正在做一个项目，我得到了一个看起来像这样的对象：

{

  "userChoice[language]": "en",

  "userChoice[responses][favColor]": "black",

  "userChoice[responses][favCity]": "new york",

}

我该如何规范化？这样我就可以访问我需要的属性了吗？

Answer 1

这是规范化对象的 es5 方法function normalisedObject(object) {    var normalised = {};    for (var key in object) {        //regex to capture all [.*] groups        var matches = key.match(/\[(.*?)\]/g);        if (matches) {            var temp = normalised;            while (matches.length > 0) {                //get first key and replace []                var newKey = matches[0].replace(/\[|\]/g, "");                if (matches.length !== 1) {                    //keep traverse if the left over keys are greater than 1                    temp = temp[newKey] || (temp[newKey] = {}); //assign empty object                } else {                    temp[newKey] = object[key];                }                //poll                matches.shift();            }        }    }    return normalised;}//exampleconst t1 = performance.now();var object = {    "userChoice[language]": "en",    "userChoice[responses][favColor]": "black",    "userChoice[responses][favCity]": "new york"};var normalised = normalisedObject(object);const t2 = performance.now();console.log(`Operation took ${t2 - t1}ms`);console.log(normalised);

Answer 2

当对象的键不允许您使用简单的点表示法时，即obj.property，您可以使用方括号表示法，例如const lang = obj["userChoice[language]"]但我有一种感觉，你真的想把那个物体变成类似这个的东西{  userChoice: {    language: "en",    responses: {      favColor: "black",      favCity: "new york"    }  }}如果是这种情况，您需要将对象条目（键/值对）减少到一个新对象，解析出关键路径并构建新的内部对象const obj = {  "userChoice[language]": "en",  "userChoice[responses][favColor]": "black",  "userChoice[responses][favCity]": "new york",}const t1 = performance.now()const normalised = Object.entries(obj).reduce((c, [ key, val ]) => {  // get the key parts as a path array  const path = key.replace(/]/g, "").split(/\[/)    // pop the last property for assigning the value later  const prop = path.pop()    // determine the inner-most object by path  const inner = path.reduce((o, k) => {    // create a new object if it doesn't exist    return o[k] ?? (o[k] = {})  }, c)    // assign the value  inner[prop] = val    return c}, {})const t2 = performance.now()console.info(normalised)console.log(`Operation took ${t2 - t1}ms`).as-console-wrapper { max-height: 100% !important; }请注意，如果您开始将任何数组属性放入 eg 中userChoice[foo][0]，这将不起作用。