JS数组到对象

Question

I have a JS array (shown 4 examples actual has 66 )

[["A","Example1"],["A","Example2"],["B","Example3"],["B","Example4"]]

that I am trying to get into an object for a multi select drop down menu:

var opt = [{
label: 'A', children:[
        {"label":"Example1","value":"Example1","selected":"TRUE"},
        {"label":"Example2","value":"Example2","selected":"TRUE"} 
      ]
},

{
label: 'B', children:[
  {"label":"Example3","value":"Example3","selected":"TRUE"},
  {"label":"Example4","value":"Example4","selected":"TRUE"}
  ]
}
]

Is there a easy way to do this ?

Answer 1

Updated: Using reduce() and filter() to get expected results.

 const result = [['A', 'Example1'], ['A', 'Example2'], ['B', 'Example3'], ['B', 'Example4']].reduce((acc, cur) => { const objFromAccumulator = acc.filter((row) => row.label === cur[0]); const newChild = {label: cur[1], value: cur[1], selected: 'TRUE'}; if (objFromAccumulator.length) { objFromAccumulator[0].children.push(newChild); } else { acc.push({label: cur[0], children: [newChild]}); } return acc; }, []); console.log(result);

Answer 2

Here's a rather efficient and concise take on the problem using an object as a map:

 const data = [["A","Example1"],["A","Example2"],["B","Example3"],["B","Example4"]]; const opt = data.reduce((results,[key,val]) => { if(!results[0][key]) //first element of results is lookup map of other elements results.push(results[0][key] = { label: key, children: [] }); results[0][key].children.push({ label: val, value: val, selected:"TRUE" }); return results; }, [{}]).slice(1); //slice off map as it's no longer needed console.log(opt);

Answer 3

Something like this should work:

const raw = [["A","Example1"],["A","Example2"],["B","Example3"],["B","Example4"]];

const seen = new Map();
const processed = raw.reduce((arr, [key, label]) => {
    if (!seen.has(key)) {
        const item = {
            label: key,
            children: []
        };
        seen.set(key, item);
        arr.push(item);
    }
    seen.get(key).children.push({
        label,
        value: label,
        selected: "TRUE"
    })
    return arr;
}, []);
console.log(processed);