如何合并对象数组

How can I merge an array of objects?

本文关键字：对象 数组 合并 何合并      更新时间：2023-09-26

假设我有一个文章数组，每个文章可能有也可能没有超过1个图像对象，现在由于mysql不能将对象分组在一起，你必须自己做。因此，结果是在重复的文章对象附近得到。。。其中唯一的区别是图像对象所谓接近重复，我的意思是返回结果的唯一区别是图像对象。

我正试图找到一种方法来循环遍历articles数组，消除重复对象，并创建一个images数组，该数组将容纳每个article图像对象。

例如，给定以下文章数组：

{ articles: [
   {article: {articleId: 10, articleText: 'blah'}, image: {articleId: 10,  imageUrl: 'http://differentUrlTooBelow'} },
   {article: {articleId: 10, articleText: 'blah'}, image: {articleId: 10, imageUrl: 'http://AnotherUrlDifferentToAbove'} },
   {article: {articleId: 11, articleText: 'ajsdnfa'}, image: {articleId: 11, imageUrl: 'http://DifferentUrlTooBelow'} },
   {article: {articleId: 11, articleText: 'asfdjnasjdf'}, image: {articleId: 11, imageUrl: 'http://AnotherUrlDifferentToAbove'} },
]}

我们可以使用lodash reduce函数，但它似乎只返回最后一个article (articleId: 11)。。。它似乎也没有找到所有的图像。它只会在每一篇文章中创建一个图像数组。注意res是文章对象的数组（如上所示）

var z = _.reduce(res, function(result, value, key) {
if (key == 0) return;
if(value.article['articleId'] == res[key-1].article['articleId']) {
  result = value;
  result.images = [];
  result.images.push(result.image);
}
return result;
}, {});

最终结果看起来像这样：

{ articles: [
   {article: {articleId: 10, articleText: 'blah'}, 
    images: [
       {articleId: 10,  imageUrl: 'http://differentUrlTooBelow'},
       {articleId: 10, imageUrl: 'http://AnotherUrlDifferentToAbove'} 
   ]},
   {article: {articleId: 11, articleText: 'blah'}, 
    images: [
       {articleId: 11,  imageUrl: 'http://differentUrlTooBelow'},
       {articleId: 11, imageUrl: 'http://AnotherUrlDifferentToAbove'} 
   ]},
]}

您可以使用_.groupBy()来匹配article.articleId，然后使用_.map()来使用第一个项目关联每个文章，然后通过_.map()获取所有image项目来设置images属性。

var data = { 
  articles: [
   {
     article: {articleId: 10, articleText: 'blah'}, 
     image: { articleId: 10, imageUrl: 'http://differentUrlTooBelow' } 
   },
   {
     article: {articleId: 10, articleText: 'blah'}, 
     image: { articleId: 10, imageUrl: 'http://AnotherUrlDifferentToAbove' } 
   },
   {
     article: {articleId: 11, articleText: 'ajsdnfa'}, 
     image: { articleId: 11, imageUrl: 'http://DifferentUrlTooBelow' }
   },
   {
     article: {articleId: 11, articleText: 'asfdjnasjdf'}, 
     image: { articleId: 11, imageUrl: 'http://AnotherUrlDifferentToAbove' } 
   }
  ]
};
var result = {
  articles: _(data.articles)
    .groupBy('article.articleId')
    .map(function(items) {
      return _(items[0])
        .omit('image')
        .set('images', _.map(items, 'image'))
        .value();
    })
    .value()
};
document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.11.2/lodash.js"></script>

相关文章：