JavaScript ::迭代嵌套的JSON对象并创建新结构

时间:2017-06-22 16:53:38

标签: javascript json object

尝试将嵌套的JSON数据(data1)重组为“正确”格式(data2)  到目前为止没有成功。

data1是根据查找html文件的给定父目录(食谱)生成的。

data2是我尝试使用data1输出的内容,因为文件夹中的任何内容都更好地表示为对象数组,而不仅仅是纯嵌套对象。

var data1 = {  
   "cake": {  
      "chocolate": {  
         "black-forest": {  
            "name": "Black Forest",
            "path": "recipes/cake/chocolate/black-forest.html"
         },
         "new-shortcake": {  
            "milk-chocolate-shortcake": {  
               "name": "Milk chocolate shortcake",
               "path": "recipes/cake/chocolate/shortcake/milk-chocolate-shortcake.html"
            },
            "dark-chocolate-shortcake": {  
               "name": "Dark chocolate shortcake",
               "path": "recipes/cake/chocolate/shortcake/dark-chocolate-shortcake.html"
            }
         }
      }
   },
   "pasta": {  
      "spaghetti": {  
         "aglio-olio": {  
            "name": "Spagehetti Aglio Olio",
            "path": "recipes/pasta/spaghetti/aglio-olio.html"
         },
         "carbonara": {  
            "name": "Carbonara",
            "path": "recipes/pasta/spaghetti/carbonara.html"
         }
      },
      "lasagna": {  
         "name": "Lasagna",
         "path": "recipes/pasta/lasagna.html"
      }
   }
}



var data2 = [
   {
      "name": "cake",
      "children": [
         {
            "name": "chocolate",
            "children": [
               {
                  "name": "Black Forest",
                  "path": "recipes/cake/chocolate/black-forest.html"
               },
               {
                  "name": "New Shortcake",
                  "children": [
                     {
                        "name": "Milk chocolate shortcake",
                        "path": "recipes/cake/chocolate/shortcake/milk-chocolate-shortcake.    html"
                     },
                     {
                        "name": "Dark chocolate shortcake",
                        "path": "recipes/cake/chocolate/shortcake/dark-chocolate-shortcake.    html"
                     }
                  ]
               }
            ]
         }
      ]
   },
   {
      "name": "pasta",
      "children": [
         {
            "name": "spaghetti",
            "children": [
               {
                  "name": "Spagehetti Aglio Olio",
                  "path": "recipes/pasta/spaghetti/aglio-olio.html"
               },
               {
                  "name": "Carbonara",
                  "path": "recipes/pasta/spaghetti/carbonara.html"
               }
            ]
         },
         {
            "name": "Lasagna",
            "path": "recipes/pasta/lasagna.html"
         }
      ]
   }
]

https://codepen.io/kyooriouskoala/pen/LLLXmG

非常感谢任何帮助!

PS:最终目标是使用新的数据结构构建菜单。

1 个答案:

答案 0 :(得分:0)

我希望这个输出符合你的意思。

var final = [];
function tree(object, temp){
for(var key in object){

var folder = {};
if(object[key] !== null && typeof object[key] == 'object'){
  //console.log(key); 

  if(_.has(object[key], "path")){
    folder.name = object[key].name;
    folder.path = object[key].path;
    folder.children = [];
  } else{
    folder.name = key;
    folder.children = object[key];
  }

  final.push(folder); 
  tree(object[key]);
}
} 

  return final;
} 

这会将您的数据输出为具有所需值的关联对象。