0

I have 2 arrays of objects with below structure:

array1 = [
  {
    categoryID: 'C1',
    links: [
      (0: {
        id: 1,
        linkID: 'A',
      }),
      (1: {
        id: 2,
        linkID: 'B',
      }),
    ],
  },
  {
    categoryID: 'C2',
    links: [
      (0: {
        id: 1,
        linkID: 'C',
      }),
      (1: {
        id: 2,
        linkID: 'D',
      }),
    ],
  },
];

array2 = [
  {
    categoryID: 'C1',
    links: [
      (0: {
        id: 1,
        linkID: 'A',
      }),
      (1: {
        id: 2,
        linkID: 'E',
      }),
    ],
  },
  {
    categoryID: 'C3',
    links: [
      (0: {
        id: 1,
        linkID: 'F',
      }),
    ],
  },
];

I want my result to be like below since both arrays have categoryID : 'C1' they should both get combined into one categoryID : 'C1' and the duplicate links[] items should get combined in this one category. ex.: linkID : "A' was common in both arrays thus should get combined:

[
  {
    categoryID: 'C1',
    links: [
      (0: {
        id: 1,
        linkID: 'A',
      }),
      (1: {
        id: 2,
        linkID: 'B',
      }),
      (3: {
        id: 3,
        linkID: 'E',
      }),
    ],
  },
  {
    categoryID: 'C2',
    links: [
      (0: {
        id: 1,
        linkID: 'C',
      }),
      (1: {
        id: 2,
        linkID: 'D',
      }),
    ],
  },
  {
    categoryID: 'C3',
    links: [
      (0: {
        id: 1,
        linkID: 'F',
      }),
    ],
  },
];

Please help me out with the javascript code for it which will be compatible for IE-11 or lower IE versions.

I have already tried .map(), .reduce() but either these are not compatible in IE11 or I am doing something wrong.

Abraham
  • 8,525
  • 5
  • 47
  • 53
JS_lover
  • 19
  • 6
  • https://stackoverflow.com/questions/1584370/how-to-merge-two-arrays-in-javascript-and-de-duplicate-items – Train Jun 20 '19 at 17:13
  • That array notation has invalid syntax. There should be no colons like that in arrays. – trincot Jun 20 '19 at 17:15
  • @Anena, Is your issue solved? If yes than please try to update the thread with your solution. If issue persist then kindly refer the solution provided by trincot. If you have any further questions than let us know about that. We will try to provide further suggestions. Thanks for your understanding. – Deepak-MSFT Jun 26 '19 at 05:19

1 Answers1

1

First concatenate the two arrays as they are. Then convert the arrays to plain objects (hash), where the keys are the strings that should be unique (categoryID, linkID). This will remove duplicates. Then convert back to the array structure.

This works in Internet Explorer 11 (tested):

var array1 = [{ categoryID : "C1", links : [{ id : 1, linkID : "A" }, { id : 2, linkID : "B" }]}, {categoryID : "C2", links : [{ id : 1, linkID : "C" }, { id : 2, linkID : "D" }] }];
var array2 = [{ categoryID : "C1", links : [{ id : 1, linkID : "A" }, { id : 2, linkID : "E" }]}, {categoryID : "C3", links : [{ id : 1, linkID : "F" }] }];

var hash = array1.concat(array2).reduce(function (acc, o) {
    acc[o.categoryID] = acc[o.categoryID] || {};
    o.links.forEach(function (link) {
        acc[o.categoryID][link.linkID] = 1;
    });
    return acc;
}, {});

var result = Object.keys(hash).map(function (cat) {
    return { 
        categoryID: cat, 
        links: Object.keys(hash[cat]).map(function (link, i) {
            return { id: i+1, linkID: link };
        })
    };
});

console.log(result);
trincot
  • 317,000
  • 35
  • 244
  • 286
  • Thanks for responding quickly. I tried your solution but it kept returning an undefined array. I have resolved the issue by other means. This post can be closed now. – JS_lover Jun 27 '19 at 08:55
  • In order to close, you should post your own solution as an answer, so that any future visitors will benefit from it. NB: Today, I ran the code I posted here on IE11 again, and it works, so I guess you did something different. – trincot Jun 27 '19 at 10:34