Javascript比较数组以标记特定元素的出现

Question

我有一个数组，其中包含 n 数组，其中包含汽车信息（color、company），如下所示：
el[0] -> 颜色值
el[1] -> 公司值

我的目标是向多少家汽车公司展示可以找到一种颜色。

例如这个数组

var array = [
  ['red', 'Ford'],
  ['blue', 'Ford'],
  ['green', 'Ford'],
  ['red', 'Ford'],
  ['red', 'Renault'],
  ['blue', 'Renault'],
  ['green', 'Opel'],
  ['red', 'Opel']
];

应该改成如下：

 result = [
  ['red', 'Ford', '3: Ford, Renault, Opel'],
  ['blue', 'Ford', '2: Ford, Renault'],
  ['green', 'Ford', '2: Ford, Open'],
  ['red', 'Renault', '3: Ford, Renault, Opel'],
  ['blue', 'Renault', '2: Ford, Renault'],
  ['green', 'Opel', '2: Ford, Opel'],
  ['red', 'Opel', '3: Ford, Renault, Opel']
 ];

说明：
有3 公司有red 颜色：Ford, Renault, Opel
有2 公司有blue 颜色：Ford, Renault
有2 公司有green 颜色：Ford, Opel

这是我认为可以解决的方法，但我不确定这是否是正确的方法：
1. 遍历每个数组，过滤颜色，得到所有适用的公司
2. 遍历过滤器响应并删除重复项
3. 再次循环主数组，并将步骤 2 的结果分配给具有过滤颜色的相应数组

Answer 1

你可以这样处理：

var array = [
  ['red', 'Ford'],
  ['blue', 'Ford'],
  ['green', 'Ford'],
  ['red', 'Ford'],
  ['red', 'Renault'],
  ['blue', 'Renault'],
  ['green', 'Opel'],
  ['red', 'Opel']
];

// To store calculated counts
var cache = {};

var result = array.map(item => {
  var key = item[0];

  // Do processing only if the item isn't found in cache
  if (!cache[key]) {
    var models = array
      // Get all the same colored items
      .filter(item1 => {
        return item1[0] === key;
      })
      // Get the list of models
      .map(item1 => {
        return item1[1];
      })
      // Extract only the unique values
      .filter((item1, i, arr) => {
        return arr.indexOf(item1) === i;
      });

    // Put the calculation in cache
    if (!cache[key]) {
      cache[key] = `${models.length}: ${models.join(', ')}`;
    }
  }

  // Append the result into original item
  item.push(cache[key]);
  
  return item;
});

console.log(result);

我使用了一个中间对象cache 来节省一些处理时间，因为对于一种颜色必须多次执行相同的操作。

Answer 2

您可以使用带有哈希表的双循环方法来收集数组的第二个元素。

var array = [['red', 'Ford'], ['blue', 'Ford'], ['green', 'Ford'], ['red', 'Ford'], ['red', 'Renault'], ['blue', 'Renault'], ['green', 'Opel'], ['red', 'Opel']],
    hash = Object.create(null);

array.forEach(function (a) {
    hash[a[0]] = hash[a[0]] || {};
    hash[a[0]][a[1]] = true;
});
array.forEach(function (a, i, aa) {
    var keys = Object.keys(hash[a[0]]);
    aa[i][2] = keys.length + ': ' + keys.join(', ');
});

console.log(array);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

您可以构建一个类似数组的关联对象，在其中按颜色存储汽车列表。然后，您可以通过使用类似关联数组的对象更改其元素来映射原始数组：

var array = [
  ['red', 'Ford'],
  ['blue', 'Ford'],
  ['green', 'Ford'],
  ['red', 'Ford'],
  ['red', 'Renault'],
  ['blue', 'Renault'],
  ['green', 'Opel'],
  ['red', 'Opel']
];

var map = array.reduce((map, row) => {
    map[row[0]] = map[row[0]] || [];
    if (!map[row[0]].includes(row[1])) {
        map[row[0]].push(row[1]);
    }
    return map;
}, {});

var result = array.map(row => (row.push(`${map[row[0]].length}: ${map[row[0]].join(', ')}`), row));

console.log(result);

以更易读的方式：

var array = [
  ['red', 'Ford'],
  ['blue', 'Ford'],
  ['green', 'Ford'],
  ['red', 'Ford'],
  ['red', 'Renault'],
  ['blue', 'Renault'],
  ['green', 'Opel'],
  ['red', 'Opel']
];

var map = array.reduce((map, row) => {
    var [ color, car ] = row;
    map[color] = map[color] || [];
    if (!map[color].includes(car)) {
        map[color].push(car);
    }
    return map;
}, {});

var result = array.map(row => { 
    var [ color, car ] = row;
    row.push(`${map[color].length}: ${map[color].join(', ')}`);
    return row;
});

console.log(result);

Answer 4

var array = [
  ['red', 'Ford'],
  ['blue', 'Ford'],
  ['green', 'Ford'],
  ['red', 'Ford'],
  ['red', 'Renault'],
  ['blue', 'Renault'],
  ['green', 'Opel'],
  ['red', 'Opel']
];

const res = array.map(set => {
  const newSet = set;
  const same = array.filter(compareSet => set[0] === compareSet[0])
    .map(compareSet => compareSet[1])
    .filter((make, i, arr) => arr.indexOf(make) === i);
  newSet.push(`${same.length} ${same.join(', ')}`);
  return newSet;
});

document.body.innerHTML = JSON.stringify(res).split('],[').join('], <br/>[');