动态创建具有可变深度的 JavaScript 对象答案

【问题标题】：Dynamically create JavaScript objects with variable depth动态创建具有可变深度的 JavaScript 对象
【发布时间】：2015-07-14 22:38:22
【问题描述】：

我遇到了一个讨厌的 JSON 对象，我需要将其转换为具有可变深度的 JS 对象。

很快：（我正在使用 jQuery）

var nastyJSON_string = "{"generics_utenteID":"1","generics_elencoID":"1","mainbar_ade_stepID_0":"1","mainbar_ade_stepID_1":"3","mainbar_ade_stepTitle_0":"blablabla", "mainbar_ade_stepTitle_1" : "quiquoqua"}";

var nastyJSON = JSON.parse(nastyJSON_string);

// nastyJSON if parsed correctly now is: {generics_utenteID:"1",generics_elencoID:"1" ...and so on}.

现在，我需要将该 nastyJSON 转换为具有可变深度的 JS 对象。我的意思是：

var reusableJSObject = {
    generics : {
        utenteID : 1,
        elencoID : 1
    },

    mainbar : {
        ade : {
            stepID : {
                0 : 1,
                1 : 3
            },

            stepTitle : {
                0 : "blablabla",
                1 : "quiquoqua"
            }
        }
    }
}

我最好是手动创建它，循环 nastyJSON，切换大小写键并创建在众所周知的深度末尾添加值的对象。

像这样：

jQuery.each(nastyJSON, function(key,value){
    var keysp = key.split('_');
    switch(keysp[0])
    {
        //# generics
        case 'generics':

            if(!reusableJSObject.hasOwnProperty(keysp[0])) { reusableJSObject[keysp[0]] = new Object(); };

            switch(keysp[1])
            {
                //# utenteID
                case 'utenteID':
                    if(!reusableJSObject[keysp[0]].hasOwnProperty(keysp[1])) { reusableJSObject[keysp[0]][keysp[1]]; };
                    reusableJSObject[keysp[0]][keysp[1]] = Number(value);
                break;

                //# elencoID
                case 'elencoID':
                    if(!reusableJSObject[keysp[0]].hasOwnProperty(keysp[1])) { reusableJSObject[keysp[0]][keysp[1]]; };
                    reusableJSObject[keysp[0]][keysp[1]] = Number(value);
                break;
            }
        break;


        //# mainbar
        case 'mainbar':
            if(!reusableJSObject.hasOwnProperty(keysp[0])) { reusableJSObject[keysp[0]] = new Object(); };
        break;

        //... and So On!
    }
});

但是，如果我一开始不知道 nastyJSON 结构，我只知道 nastyJSON 有我必须拆分和嵌套直到拆分结束的键？

提前致谢。

【问题讨论】：

我无法更改必须解析的字符串类型（nastyJSON_string）。我必须使用其中带有“_”的键来指示最终 js 对象中的级别更改。

标签： javascript jquery json javascript-objects

【解决方案1】：

你不需要 jQuery，vanilla JS 就可以了（here 是一个小提琴）：

var json = '{"generics_utenteID":"1","generics_elencoID":"1","mainbar_ade_stepID_0":"1","mainbar_ade_stepID_1":"3","mainbar_ade_stepTitle_0":"blablabla", "mainbar_ade_stepTitle_1" : "quiquoqua"}';
var obj  = JSON.parse(json);

function parse(object) {
    var result = {};
    var temp   = {};
    var keys;

    for (var property in object) {
        keys = property.split('_');
        temp = result;

        for (var i = 0; i < keys.length - 1; i++) {
            if (typeof temp[keys[i]] == 'undefined') {
                temp[keys[i]] = {};
            }
            temp = temp[keys[i]];
        };

        temp[keys[i]] = object[property];
    }

    return result;

}

console.log(JSON.stringify(parse(obj)));

输出：

{
   "generics":{
      "utenteID":"1",
      "elencoID":"1"
   },
   "mainbar":{
      "ade":{
         "stepID":{
            "0":"1",
            "1":"3"
         },
         "stepTitle":{
            "0":"blablabla",
            "1":"quiquoqua"
         }
      }
   }
}

【讨论】：