Contrast the identification numbers in a matrix with the identification numbers in a separate matrix

Question

Contrast the identification numbers in a matrix with the identification numbers in a separate matrix

Today, we will be exploring how to group arrays of objects in JavaScript by ID. In this scenario, we have an array of IDs nested in an object of arrays (item3) that will be compared with another array of objects.

var existingArray = [
    {
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200", "0100"],
      "item4": "blah4",
      "item5": "blah5"
    }
]

We now introduce our beloved DATA2 array which holds valuable information that we want to extract, specifically the "CandidateName" if the "relatedId" matches any of the IDs in item3 within EXISTINGARRAY.

var data2 = [
    {"CandidateName": "Mary", "relatedId": ["0100", "0200"]},
    { "CandidateName": "John", "relatedId": ["0200"]},
    { "CandidateName":"Peter", "relatedId": ["0300", "0100"]},
    { "CandidateName": "Paul", "relatedId": ["0300"]}
];

The goal here is to search for matching IDs between data2[i].relatedId[j] and existingArray[k].item3[l], then extract the corresponding "CandidateName" and append it to EXISTINGARRAY. The end result should resemble the following:

existingArray = [
    {
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200","0300"],
      "item4": "blah4",
      "item5": "blah5",
      "item6": ["Mary", "Jonh", "Peter", "Paul"]
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100","0300"],
      "item4": "blah4",
      "item5": "blah5",
      "item6": ["Mary", "Peter", "Paul"]
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100"],
      "item4": "blah4",
      "item5": "blah5",
      "item6": ["Mary", "Peter"]
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0300"],
      "item4": "blah4",
      "item5": "blah5",
      "item6": ["Peter", "Paul"]
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200", "0100"],
      "item4": "blah4",
      "item5": "blah5",
      "item6": ["Mary", "John","Peter"]
    }
]

javascript arrays multidimensional-array

Answer 1

Answer №1

We can solve this using ES6 by following the code snippet below:

existingArray.forEach( function (obj) {
    obj.item6 = [...new Set(obj.item3.reduce( (acc, id) => acc.concat(this.get(id)), [] ))]
}, data2.reduce (
    (acc, obj) => obj.relatedId.reduce (
        (acc, id) => acc.set(id, (acc.get(id) || []).concat(obj.CandidateName)), acc
    ), new Map()
));

var existingArray = [
    {
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200", "0100"],
      "item4": "blah4",
      "item5": "blah5"
    }
]

var data2 = [
    {"CandidateName": "Mary", "relatedId": ["0100", "0200"]},
    { "CandidateName": "John", "relatedId": ["0200"]},
    { "CandidateName":"Peter", "relatedId": ["0300", "0100"]},
    { "CandidateName": "Paul", "relatedId": ["0300"]}
];

existingArray.forEach( function (obj) {
    obj.item6 = [...new Set(obj.item3.reduce( (acc, id) => acc.concat(this.get(id)), [] ))]
}, data2.reduce (
    (acc, obj) => obj.relatedId.reduce (
        (acc, id) => acc.set(id, (acc.get(id) || []).concat(obj.CandidateName)), acc
    ), new Map()
));

console.log(existingArray);

Detailed Explanation

The code starts with creating an empty Map:

new Map()

This map is used as the accumulator (acc) while iterating over data2 array using reduce:

data2.reduce

Nested reduce operations allow iteration over each relatedId. If the accumulated value (acc) doesn't contain the id yet, a new array is created:

acc.get(id) || []

If the id already exists in the map, its corresponding array is used. Candidate name is then appended to it:

.concat(obj.CandidateName)

This updated array is set back into acc for the key id:

acc.set(id, ...)

The set method returns acc, which works well with reduce as it needs the return value for further accumulation.

The result of outer reduce call is a Map keyed by all ids from data2, with corresponding arrays of names.

This resulting map is passed as the second argument to forEach, becoming the reference for this. So when you see:

this.get(id)

it fetches the candidate name array for id from the map.

In the forEach callback, another reduce operates on item3 values:

obj.item3.reduce

An array of names accumulates and is then converted to a unique set using Set:

new Set(...)

The set is spread back into an array to remove duplicates:

[...new Set()]

This procedure assigns values to all item6 properties.

Answer 2

We can solve this using ES6 by following the code snippet below:

existingArray.forEach( function (obj) {
    obj.item6 = [...new Set(obj.item3.reduce( (acc, id) => acc.concat(this.get(id)), [] ))]
}, data2.reduce (
    (acc, obj) => obj.relatedId.reduce (
        (acc, id) => acc.set(id, (acc.get(id) || []).concat(obj.CandidateName)), acc
    ), new Map()
));

var existingArray = [
    {
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100","0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0100"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0300"],
      "item4": "blah4",
      "item5": "blah5"
    },{
      "item1": "Blah1",
      "item2": "blah2",
      "item3": ["0200", "0100"],
      "item4": "blah4",
      "item5": "blah5"
    }
]

var data2 = [
    {"CandidateName": "Mary", "relatedId": ["0100", "0200"]},
    { "CandidateName": "John", "relatedId": ["0200"]},
    { "CandidateName":"Peter", "relatedId": ["0300", "0100"]},
    { "CandidateName": "Paul", "relatedId": ["0300"]}
];

existingArray.forEach( function (obj) {
    obj.item6 = [...new Set(obj.item3.reduce( (acc, id) => acc.concat(this.get(id)), [] ))]
}, data2.reduce (
    (acc, obj) => obj.relatedId.reduce (
        (acc, id) => acc.set(id, (acc.get(id) || []).concat(obj.CandidateName)), acc
    ), new Map()
));

console.log(existingArray);

Detailed Explanation

The code starts with creating an empty Map:

new Map()

This map is used as the accumulator (acc) while iterating over data2 array using reduce:

data2.reduce

Nested reduce operations allow iteration over each relatedId. If the accumulated value (acc) doesn't contain the id yet, a new array is created:

acc.get(id) || []

If the id already exists in the map, its corresponding array is used. Candidate name is then appended to it:

.concat(obj.CandidateName)

This updated array is set back into acc for the key id:

acc.set(id, ...)

The set method returns acc, which works well with reduce as it needs the return value for further accumulation.

The result of outer reduce call is a Map keyed by all ids from data2, with corresponding arrays of names.

This resulting map is passed as the second argument to forEach, becoming the reference for this. So when you see:

this.get(id)

it fetches the candidate name array for id from the map.

In the forEach callback, another reduce operates on item3 values:

obj.item3.reduce

An array of names accumulates and is then converted to a unique set using Set:

new Set(...)

The set is spread back into an array to remove duplicates:

[...new Set()]

This procedure assigns values to all item6 properties.

Answer 3

Answer №2

To add item6 to the existingArray, you can loop through it and use the map() function. To create the array containing item6, first utilize filter() and some() to filter objects with related values in their relatedId matching the current object's item3 in the existingArray. Then, simply use map() to retrieve only the names and return the object.

var existingArray = [{"item1":"Blah1","item2":"blah2","item3":["0200","0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0100","0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0100"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0200","0100"],"item4":"blah4","item5":"blah5"}];
var data2 = [{"CandidateName":"Mary","relatedId":["0100","0200"]},{"CandidateName":"John","relatedId":["0200"]},{"CandidateName":"Peter","relatedId":["0300","0100"]},{"CandidateName":"Paul","relatedId":["0300"]}];

var result = existingArray.map(function(o) {
  o.item6 = data2.filter(function(e) {
    return o.item3.some(function(a) {
      return e.relatedId.indexOf(a) != -1;
    })
  }).map(function(e) {
    return e.CandidateName;
  })
  return o;
})

console.log(result)

Answer 4

To add item6 to the existingArray, you can loop through it and use the map() function. To create the array containing item6, first utilize filter() and some() to filter objects with related values in their relatedId matching the current object's item3 in the existingArray. Then, simply use map() to retrieve only the names and return the object.

var existingArray = [{"item1":"Blah1","item2":"blah2","item3":["0200","0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0100","0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0100"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0300"],"item4":"blah4","item5":"blah5"},{"item1":"Blah1","item2":"blah2","item3":["0200","0100"],"item4":"blah4","item5":"blah5"}];
var data2 = [{"CandidateName":"Mary","relatedId":["0100","0200"]},{"CandidateName":"John","relatedId":["0200"]},{"CandidateName":"Peter","relatedId":["0300","0100"]},{"CandidateName":"Paul","relatedId":["0300"]}];

var result = existingArray.map(function(o) {
  o.item6 = data2.filter(function(e) {
    return o.item3.some(function(a) {
      return e.relatedId.indexOf(a) != -1;
    })
  }).map(function(e) {
    return e.CandidateName;
  })
  return o;
})

console.log(result)

Contrast the identification numbers in a matrix with the identification numbers in a separate matrix

Answer №1

Detailed Explanation

Answer №2

Similar questions

Learn how to utilize Jquery to create a dynamic slide effect that toggles the

Is there a definitive way to distinguish between scrollTop and scrollHeight in web development?

Locate the initial occurrence of a duplicated element within an array

Unable to get knockout sorting to function properly

React - Uncaught TypeError: Cannot access property 'renderSidebaritem' of an undefined object

Utilizing Array Filters and State in React JS to Conceal Table Columns

Ways to calculate the sum of multiple series in highcharts

JavaScript: What's the best way to update the URL in the address bar without triggering a page refresh?

Best practice for validating a form using React: Why the state doesn't update immediately with useState and onSubmit

How to access nested arrays within an array using PHP

Activating HTML 5 mode within Angular

Combining ctype structure and array in Python

Transforming jQuery into pure Javascript code

Creating a four-dimensional array in PHP can be achieved by nesting multiple arrays within each

Manifestation for JSON Firebug extension

Retrieve all rows, with a specific row positioned at the top of the heap

Use the clientID property of the controlname element within JavaScript to access the element using the getElementById method with only

Discover additional and subtract options

Limit users to entering either numbers or letters in the input field

Retrieve the selected options from the checkbox and transfer them to the input text field