javascript - 无法在多维数组上应用扩展运算符

Question

我有一个多维数组，我想对其应用扩展运算符来获取一个没有重复值的数组。这是多维数组:

colorArray = [
['Bead Link Layered Anklet', 'Gold, Hematite'],
['Bead Link Layered Anklet', 'Gold, Multi, Neutral'],
['Bead Link Layered Anklet', 'Gold, Multi, Neon'],
['Bead Link Layered Anklet', 'Gold, Multi, Neon'],
['Colorful Beaded Anklet', 'Fuchsia, Gold'],
['Colorful Beaded Anklet', 'Yellow'],
['Rhinestone Pave Chain Layered Anklets','Gold Theme']
]

当我通过应用推送运算符压平数组时，它不再是多维数组，它看起来像这样:

colorArray = 
[
  'Bead Link Layered Anklet',
  'Gold, Hematite',
  'Bead Link Layered Anklet',
  'Gold, Multi, Neutral',
  'Bead Link Layered Anklet',
  'Gold, Multi, Neon',
  'Bead Link Layered Anklet',
  'Gold, Multi, Neon',
  'Colorful Beaded Anklet',
  'Fuchsia, Gold',
  'Colorful Beaded Anklet',
  'Yellow',
  'Rhinestone Pave Chain Layered Anklets',
  'Gold Theme '
]

我的问题是，如果数组是平的，我只能应用扩展运算符，但我想保留结构，所以我不想展平它。这是当我将扩展运算符应用于平面数组时得到的结果:

unique = 
[
  'Bead Link Layered Anklet',
  'Cream, Gold',
  'Gold, Hematite',
  'Gold, Multi, Neutral',
  'Gold, Multi, Neon',
  'Colorful Beaded Anklet',
  'Fuchsia, Gold',
  'Yellow',
  'Rhinestone Pave Chain Layered Anklets',
  'Gold Theme'
]

我希望结果如下所示:

['Bead Link Layered Anklet', ['Gold, Hematite', 'Gold, Multi, Neutral', 'Gold, Multi, Neon'],
['Colorful Beaded Anklet', ['Fuchsia, Gold', 'Yellow'],
['Rhinestone Pave Chain Layered Anklets','Gold Theme']

这是我用来消除重复项的方法:

unique = [...new Set(colorArray)];

Answer 1

基于this code :

var colorArray = [
  ['Bead Link Layered Anklet', 'Gold, Hematite'],
  ['Bead Link Layered Anklet', 'Gold, Multi, Neutral'],
  ['Bead Link Layered Anklet', 'Gold, Multi, Neon'],
  ['Bead Link Layered Anklet', 'Gold, Multi, Neon'],
  ['Colorful Beaded Anklet', 'Fuchsia, Gold'],
  ['Colorful Beaded Anklet', 'Yellow'],
  ['Rhinestone Pave Chain Layered Anklets', 'Gold Theme']
];

let result = [...Object.values(
  colorArray.reduce((acc, el) => {
    var key = el[0],
      value = el[1];
    acc[key] = acc[key] || {
      key,
      values: []
    };
    if (!acc[key].values.includes(value))
      acc[key].values.push(value);
    return acc;
  }, {})).map(el => [el.key, el.values])];

console.log(result);