JS数组到对象的数组答案

【问题标题】：JS array of arrays to objectJS数组到对象的数组
【发布时间】：2019-12-11 21:02:27
【问题描述】：

我有一个 JS 数组（显示 4 个示例，实际有 66 个）

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

我正在尝试进入多选下拉菜单的对象：

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"}
  ]
}
]

有没有简单的方法来做到这一点？

【问题讨论】：

可以用一个.reduce() 来完成，尽管“简单”肯定是相对的，因此对您问题的回答是主观的“是”或“否”。也许您可以分享您的尝试或遇到的特定困难，以便我们可以提供帮助，而不是为您编写代码:)
（值得一提的是，我还删除了您问题中对 JSON 的所有引用，包括标题和标签，因为它似乎不相关。）
我目前正在尝试找出一种使用 For 循环的方法。从识别嵌入数组的唯一第一个值开始，然后遍历数组查找与唯一值列表匹配的数组。
我认为，ES6 映射不是对象数组，而是让事情变得更容易。

标签： javascript arrays object multi-select

【解决方案1】：

更新：使用reduce() 和filter() 获得预期结果。

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);

【讨论】：

这很棒，但与我想要实现的目标相反。我想从数组数组到“标签”格式。
@TygerGuzman 结果不是我的答案中标签格式的数组数组吗？ [["A", "Example1"], ["A", "Example2"], ["B", "Example3"], ["B", "Example4"]]
我正在尝试从 [["A","Example1"],["A","Example2"],["B","Example3"],["B","Example4"]] 转到 [{ 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"} ] } ]

【解决方案2】：

这样的事情应该可以工作：

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);

【讨论】：

【解决方案3】：

下面是使用对象作为地图的一个相当有效和简洁的解决方法：

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);

【讨论】：