仅使用 Array.prototype.map() 和 Array.prototype.filter() 来实现以下结果答案

【问题标题】：Use Array.prototype.map() and Array.prototype.filter() only to achieve the following results仅使用 Array.prototype.map() 和 Array.prototype.filter() 来实现以下结果
【发布时间】：2019-12-23 01:13:39
【问题描述】：

我有这个对象：

const data = [
  { "key": "Arnav", "value": "J Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access01" },
  { "key": "Amit", "value": "UP Access02" },
  { "key": "Arnav", "value": "J Access01" },
  { "key": "John", "value": "EUP Access" },
  { "key": "John", "value": "EUP Access1" },    
  { "key": "Arnav", "value": "J Access02" }
];

我只想用map和filter把它转换成这个对象：

const result = [
  { "key": "Arnav", "value":["J Access","J Access02", "J Access01"]},
  { "key": "Amit", "value": ["UP Access","UP Access01","UP Access02"]},
  { "key": "John", "value": ["EUP Access", "EUP Access1"]}
];

即唯一键值对（数组）

【问题讨论】：

标签： javascript arrays object array.prototype.map

【解决方案1】：

理想情况下，您应该使用Array.prototype.reduce 对项目进行分组，首先使用Array.prototype.findIndex 查找项目是否已经存在，然后使用Set 处理重复的项目。

如果存在，只需将 value 添加到现有的分组数组中（在检查重复项之前），否则在分组/累积数组中添加一个新条目：

const data = [
  { "key": "Arnav", "value": "J Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access01" },
  { "key": "Amit", "value": "UP Access02" },
  { "key": "Arnav", "value": "J Access01" },
  { "key": "John", "value": "EUP Access" },
  { "key": "John", "value": "EUP Access1" },    
  { "key": "Arnav", "value": "J Access02" }
];

const grouped = data.reduce((acc, ele) => {
  const idx = acc.findIndex(obj => obj.key === ele.key);
  if(idx >= 0){
    acc[idx].value = [...new Set(acc[idx].value).add(ele.value)];
  }else{
    acc.push({key: ele.key, value: [ele.value]});
  }
  return acc;
}, []);
console.log(grouped);

【讨论】：

【解决方案2】：

您可以使用Set 和map 来获取唯一项目列表。然后，您可以使用filter 并根据这些项目构建一个新对象，并像这样映射：

const data = [
  { "key": "Arnav", "value": "J Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access" },
  { "key": "Amit", "value": "UP Access01" },
  { "key": "Amit", "value": "UP Access02" },
  { "key": "Arnav", "value": "J Access01" },
  { "key": "John", "value": "EUP Access" },
  { "key": "John", "value": "EUP Access1" },    
  { "key": "Arnav", "value": "J Access02" }
];

let result = [...new Set(data.map(i => i.key))]
  .map(key => ({ key, value: [...data.filter(i => i.key == key).map(i => i.value)] }))

console.log(result)

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

【讨论】：

【解决方案3】：

您可以在组上添加一些逻辑和闭包，然后按同一组的第一个找到的项目进行过滤。

const
    data = [{ "key": "Arnav", value: "J Access" }, { key: "Amit", value: "UP Access" }, { key: "Amit", value: "UP Access" }, { key: "Amit", value: "UP Access01" }, { key: "Amit", value: "UP Access02" }, { key: "Arnav", value: "J Access01" }, { key: "John", value: "EUP Access" }, { key: "John", value: "EUP Access1" }, { key: "Arnav", value: "J Access02" }],
    result = data
        .map((hash => ({ key, value }) => ((hash[key] = (hash[key] || [])).push(value), { key, value: hash[key] }))({}))
        .filter((s => ({ key }) => !s.has(key) && s.add(key))(new Set))

console.log(result);

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

【讨论】：