Utilizing JS Underscore for combining and organizing arrays with common keys

Question

Utilizing JS Underscore for combining and organizing arrays with common keys

I am facing a scenario where I have two arrays:

"array_one":
[
    {
    "id": 1,
    "name": One
     },
     {
     "id": 2,
     "name": Two
     }
]

"array_two":
[
    {
    "id": 1,
    "name": Uno
     },
     {
     "id": 3,
     "name": Three
     }
]

My task involves using Underscore to achieve the following objectives:

Replace all objects in array_one with objects that share the same id from array_two.
Add any objects from array_two to array_one if there isn't already an object with their id present.
The replaced objects should maintain their original position in the array.
Any added objects need to be placed at the end of the array.

As a result, the final array should appear as follows:

"array_final":
[
    {
    "id": 1,
    "name": Uno
     },
    {
    "id": 2,
    "name": Two
     },
     {
     "id": 3,
     "name": Three
     }
]

javascript arrays json underscore.js

Answer 1

Answer №1

var array1 = 
[
    {
    "id": 1,
    "name": 'Apple'
     },
     {
     "id": 2,
     "name": 'Banana'
     }
];

var array2 = 
[
    {
    "id": 1,
    "name": 'Manzana'
     },
     {
     "id": 3,
     "name": 'Orange'
     }
];


function compareArrays(arr1, arr2) {
  
  var tempArray = _.map(arr1, function(value) {
    var obj = _.first(_.filter(arr2, function(secondArr) { return secondArr.id === value.id; }));
    return !!obj ? obj : value;
  });
  
  return _.union(tempArray, _.filter(arr2, function(value) { return !_.some(tempArray, function(secondArr) { secondArr.id == value.id }); }));
}

var result = compareArrays(array1, array2);

console.log(result);

<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

Answer 2

var array1 = 
[
    {
    "id": 1,
    "name": 'Apple'
     },
     {
     "id": 2,
     "name": 'Banana'
     }
];

var array2 = 
[
    {
    "id": 1,
    "name": 'Manzana'
     },
     {
     "id": 3,
     "name": 'Orange'
     }
];


function compareArrays(arr1, arr2) {
  
  var tempArray = _.map(arr1, function(value) {
    var obj = _.first(_.filter(arr2, function(secondArr) { return secondArr.id === value.id; }));
    return !!obj ? obj : value;
  });
  
  return _.union(tempArray, _.filter(arr2, function(value) { return !_.some(tempArray, function(secondArr) { secondArr.id == value.id }); }));
}

var result = compareArrays(array1, array2);

console.log(result);

<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

Answer 3

Answer №2

To create two hash tables using objects, one to track added objects and another for the second array. Then, utilize reduce function to replace objects from the first array if they are found in the second array. Finally, use an additional loop to add the remaining objects from the second array.

var data = {
  "array_one": [{
    "id": 1,
    "name": 'One'
  }, {
    "id": 2,
    "name": 'Two'
  }],
  "array_two": [{
    "id": 1,
    "name": 'Uno'
  }, {
    "id": 3,
    "name": 'Three'
  }]
}

var obj = {}, added = {}
data.array_two.forEach(e => obj[e.id] = e)

var result = {finalArray: data.array_one.reduce(function(r, e) {
  r.push(obj[e.id] ? (added[e.id] = 1, obj[e.id]) : e);
  return r;
}, [])}

for(var i in obj) if(!added[obj[i].id]) result.finalArray.push(obj[i]) 

console.log(result)

Answer 4

To create two hash tables using objects, one to track added objects and another for the second array. Then, utilize reduce function to replace objects from the first array if they are found in the second array. Finally, use an additional loop to add the remaining objects from the second array.

var data = {
  "array_one": [{
    "id": 1,
    "name": 'One'
  }, {
    "id": 2,
    "name": 'Two'
  }],
  "array_two": [{
    "id": 1,
    "name": 'Uno'
  }, {
    "id": 3,
    "name": 'Three'
  }]
}

var obj = {}, added = {}
data.array_two.forEach(e => obj[e.id] = e)

var result = {finalArray: data.array_one.reduce(function(r, e) {
  r.push(obj[e.id] ? (added[e.id] = 1, obj[e.id]) : e);
  return r;
}, [])}

for(var i in obj) if(!added[obj[i].id]) result.finalArray.push(obj[i]) 

console.log(result)

Utilizing JS Underscore for combining and organizing arrays with common keys

Answer №1

Answer №2

Similar questions

Ways to resolve the issue of data not displaying on the page, even though it appears in the

Instructions on how to activate scrolling for a div element that becomes visible upon clicking a button

Having trouble sending a file to a web service and receiving the response in Json format?

A guide to accessing array elements (JSON) in Angular

Managing Events in Angular 2 and Creating Custom Event Handlers

Implementing an onclick function to execute a search operation

Illuminate a corresponding regular expression within a text input

Error: Papa is not defined. The file was loaded from the CDN in the header section

Utilizing Javascript / jQuery to eliminate specific CSS styles

utilize jQuery to load webpage with an HTML dropdown element

The Jquery Index() method often results in a return value of -

How to prevent all boxes in jQuery from sliding up at the same time

Why is my JSON file turning into a folder on Firebase when I attempt to access it with Flutter?

Can an input element be used to showcase a chosen image on the screen?

Is the 'Document' term not recognized within expressjs?

The ternary operator is malfunctioning when it comes to the condition

Finding mongoose in an array of objects nested within another object

Trouble with Title Updating in Next.js and Tailwind CSS Project

Encounter the error message "Socket closure detected" upon running JSReport in the background on a RHEL system

Utilize Content Delivery Network Components in Conjunction with a Command Line Interface Build