如何使用reduce合并JavaScript对象数组？

Question

这里有很多关于合并与我的问题相关的 javaScript 数组对象的帖子，其中大多数是合并 2 个数组，在我的情况下是不同的。

我有来自 API 的 JSON 我映射并过滤了它们，因为我只需要“标签”

这是我的代码：

JSON.map((key) => (key.tags))
.filter(function (element) {
    return element !== undefined;
})

这是我的结果：

   [ 
      { 
    "web_devt": { 
      "item_id": "858850847", 
      "tag": "web_devt" 
    } 
  }, 
  { 
    "web_devt": { 
      "item_id": "1004644524", 
      "tag": "web_devt" 
    } 
  }, 
  { 
    "pdo": { 
      "item_id": "1056300113", 
      "tag": "pdo" 
    }, 
    "php": { 
      "item_id": "1056300113", 
      "tag": "php" 
    }, 
    "web_devt": { 
      "item_id": "1056300113", 
      "tag": "web_devt" 
    } 
  }, 
  { 
    "parallax scrolling": { 
      "item_id": "1087678088", 
      "tag": "parallax scrolling" 
    } 
  }, 
  { 
    "react": { 
      "item_id": "2435593852", 
      "tag": "react" 
    } 
  }, 
  { 
    "javascript": { 
      "item_id": "2435595088", 
      "tag": "javascript" 
    } 
  }, 
  { 
    "react": { 
      "item_id": "2465629468", 
      "tag": "react" 
    } 
  } 
] 

我想像这样合并它们：

[
{
"web_devt": [
    item_id: "765558416", 
        item_id: "765558416",
        item_id: "765558416",
        ...]
},
 {
"react": [
    item_id: "765558416",
    item_id: "765558416",
    item_id: "765558416",
    ...]
},
{
"JavaScipt": [
    item_id: "765558416",
    item_id: "765558416",
    item_id: "765558416",
    ...]
}

]

等等......基本上所有相同的标签都会合并你如何在reduce或任何解决方案中做到这一点，但不是loadash或任何第三方？

Answer 1

您所需的输出语法无效。 你不能有一个带键的数组，也不能有一个带有多个同名键的对象。

但是，如果你想要一个 id 数组，你可以使用 reduce 和分组数据，对于单个项目使用Object.entries来获取对象中的键和值。

 var data = [ { "web_devt": { "item_id": "858850847", "tag": "web_devt" } }, { "web_devt": { "item_id": "1004644524", "tag": "web_devt" } }, { "pdo": { "item_id": "1056300113", "tag": "pdo" }, "php": { "item_id": "1056300113", "tag": "php" }, "web_devt": { "item_id": "1056300113", "tag": "web_devt" } }, { "parallax scrolling": { "item_id": "1087678088", "tag": "parallax scrolling" } }, { "react": { "item_id": "2435593852", "tag": "react" } }, { "javascript": { "item_id": "2435595088", "tag": "javascript" } }, { "react": { "item_id": "2465629468", "tag": "react" } } ] const res = data.reduce((acc, item) => { Object.entries(item).forEach((attr) => { const [key,value] = attr; if(value.tag !== undefined) { if (acc[key]){ acc[key].push(value.item_id); } else { acc[key] = [value.item_id]; } } }); return acc; }, {}) console.log(res);

Answer 2

假设内部数组旨在包含对象，请使用.reduce将输入对象分组为item_id索引的对象，然后使用Object.entries将该对象转换为数组：

 const input = [ { "web_devt": { "item_id": "858850847", "tag": "web_devt" } }, { "web_devt": { "item_id": "1004644524", "tag": "web_devt" } }, { "pdo": { "item_id": "1056300113", "tag": "pdo" }, "php": { "item_id": "1056300113", "tag": "php" }, "web_devt": { "item_id": "1056300113", "tag": "web_devt" } }, { "parallax scrolling": { "item_id": "1087678088", "tag": "parallax scrolling" } }, { "react": { "item_id": "2435593852", "tag": "react" } }, { "javascript": { "item_id": "2435595088", "tag": "javascript" } }, { "react": { "item_id": "2465629468", "tag": "react" } } ]; const outputObj = input.reduce((a, outerObj) => { Object.entries(outerObj).forEach(([key, { item_id }]) => { if (!a[key]) a[key] = []; a[key].push({ item_id }); }); return a; }, {}); const output = Object.entries(outputObj).map(([key, arr]) => ({ [key]: arr })); console.log(output);

Answer 3

这是我尝试将Array.reduce()与嵌套的Object.values()和Array.forEach() ：

 const input = [ { "web_devt": {"item_id": "858850847", "tag": "web_devt"} }, { "web_devt": {"item_id": "1004644524", "tag": "web_devt"} }, { "pdo": {"item_id": "1056300113", "tag": "pdo"}, "php": {"item_id": "1056300113", "tag": "php"}, "web_devt": {"item_id": "1056300113", "tag": "web_devt"} }, { "parallax scrolling": {"item_id": "1087678088", "tag": "parallax scrolling"} }, { "react": { "item_id": "2435593852", "tag": "react"} }, { "javascript": {"item_id": "2435595088", "tag": "javascript"} }, { "react": {"item_id": "2465629468", "tag": "react"} } ]; let res = input.reduce((acc, obj) => { Object.values(obj).forEach(({item_id, tag}) => { acc[tag] = acc[tag] || {[tag]:[]} acc[tag][tag].push(item_id); }); return acc; }, {}); console.log(Object.values(res));

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