使用 JS 从平面文件构建树形结构 JSON

Question

所以我对 JS 很陌生，并且使用循环从平面文件获取 JSON 树格式的数据。 我正在尝试构建 SAP UI5 应用程序并将数据加载到树表中。

我有这个数据

roles: [ { role: 'JLP', desc: "jlp role", query:"q1" }, { role: 'JLP', desc: "jlp role", query:"q2" }, { role: 'JLP', desc: "jlp role", query:"q3" }, { role: 'DJF', desc: "djf role", query:"q1" }, { role: 'DJF', desc: "djf role", query:"q2" }, { role: 'CJ', desc: "CJ role", query:"q1" } ]

我正在尝试将其纳入基于角色的结构中

{ "roles": [ { "rolename": "JLP", "properties": [ { "role": "JLP", "desc": "jlp role", "query": "q1" }, { "role": "JLP", "desc": "jlp role", "query": "q2" }, { "role": "JLP", "desc": "jlp role", "query": "q3" } ] }, { "rolename": "DJF", "properties": [ { "role": "DJF", "desc": "djf role", "query": "q1" }, { "role": "DJF", "desc": "djf role", "query": "q2" } ] }, { "rolename": "CJ", "properties": [ { "role": "CJ", "desc": "cj role", "query": "q1" } ] } ] }

我首先搭建角色结构，制作整体数据结构：

`buildData:function(o){
//find all types of roles
var unique= [];
for(i = 0; i < o.length; i++){
  var rolename = o[i].role;

  if(unique.indexOf(rolename)< 0) unique.push(rolename);
}

//create data structure
var datForm ={results:{roles:[]}};
 var prop = {rolename:"",
           properties:[]};
unique.forEach(function(a,index){
  prop.rolename = a
  datForm.results.roles.push(prop)
  prop = {rolename:"",
           properties:[]};
 
 
});`

我遇到困难的是，当我尝试循环数据时，我必须对数组段进行硬编码，并且当我尝试使用“i”时它不起作用。我不清楚当数据与先前创建的数据结构中的角色匹配时，我到底需要做什么来获取数据来推送段。

 `for(i = 0; i < o.length; i++){
  var current = o[i].role;
  var segment = o[i];
 
  if(current === datForm.results.roles[0].rolename) 
    datForm.results.roles[0].properties.push(segment)
  if(current === datForm.results.roles[1].rolename) 
    datForm.results.roles[1].properties.push(segment)
    if(current === datForm.results.roles[2].rolename) 
    datForm.results.roles[2].properties.push(segment)
    }

//console.log(datForm)
var oModel = this.getView().getModel();
oModel.setData(datForm)
this.getView().byId("TreeTableBasic").bindRows("/results")`

这是可行的，但是如果我使用角色较少或较多的数据，它基本上会崩溃并且无法工作。您能推荐更好的方法吗？谢谢！ 这是我正在处理的示例：https://jsbin.com/kovevej/edit?html,js,output

Answer 1

您可以使用reduce。累加器充当从角色到代表该角色的对象的键/值存储映射。我们将每个输入元素添加到正确对象中的

properties

数组中。最后，我们使用 Object.values() 来获取累加器中的值数组。

const data = [ { role: 'JLP', desc: "jlp role", query:"q1" }, { role: 'JLP', desc: "jlp role", query:"q2" }, { role: 'JLP', desc: "jlp role", query:"q3" }, { role: 'DJF', desc: "djf role", query:"q1" }, { role: 'DJF', desc: "djf role", query:"q2" }, { role: 'CJ', desc: "CJ role", query:"q1" } ]

const output = {
  roles: Object.values(data.reduce((a, {role, desc, query}) => (
    (a[role] ??= {rolename: role, properties: []})
      .properties.push({role, desc, query}), a), {}))
}

console.log(output)