Checking and merging arrays in Javascript

Question

Checking and merging arrays in Javascript

I have a unique challenge involving two arrays of objects that I need to merge while excluding any duplicates. Specifically, if an object with the key apple: 222 already exists in the first array, it should be excluded from the second array.

Please see below for the initial arrays:


var arr1 = [
    {apple: 111, tomato: 55},
    {apple: 222, tomato: 55}
]

var arr2 = [
    {apple: 222, tomato: 55},
    {apple: 333, tomato: 55}
]

The desired output should look like this:


var res = [
    {apple: 111, tomato: 55},
    {apple: 222, tomato: 55},
    {apple: 333, tomato: 55}
]

Can you guide me on how I could achieve this using JavaScript?

javascript

Answer 1

Answer №1

Is this solution suitable for your requirements (view demo) ?

let finalResult, index, element, previousElement;

// merging arrays
finalResult = [].concat(array1, array2);

// sorting the merged array based on the 'apple' property
finalResult.sort(function (x, y) {
    return x.apple - y.apple;
});

for (index = finalResult.length - 1; index >= 0; index--) {
    element = finalResult[index];

    // comparing each element with the previous one based on the 'apple' property
    if (previousElement && element.apple === previousElement.apple) {

        // removing elements if properties match
        finalResult.splice(index, 1);
    }
    previousElement = element;
}

Answer 2

Is this solution suitable for your requirements (view demo) ?

let finalResult, index, element, previousElement;

// merging arrays
finalResult = [].concat(array1, array2);

// sorting the merged array based on the 'apple' property
finalResult.sort(function (x, y) {
    return x.apple - y.apple;
});

for (index = finalResult.length - 1; index >= 0; index--) {
    element = finalResult[index];

    // comparing each element with the previous one based on the 'apple' property
    if (previousElement && element.apple === previousElement.apple) {

        // removing elements if properties match
        finalResult.splice(index, 1);
    }
    previousElement = element;
}

Answer 3

Answer №2

A solution to remove duplicates can be implemented through a dedupe function.

if (!Array.prototype.dedupe) {
  Array.prototype.dedupe = function (type) {
    for (var i = 0, l = this.length - 1; i < l; i++) {
      if (this[i][type] === this[i + 1][type]) {
        this.splice(i, 1);
        i--; l--;
      }
    }
    return this;
  }
}

function combine(arr1, arr2, key) {
  return arr1
    .concat(arr2)
    .sort(function (a, b) { return a[key] - b[key]; })
    .dedupe(key);   
}

var combined = combine(arr1, arr2, 'apple');

JSFiddle Example.

Answer 4

A solution to remove duplicates can be implemented through a dedupe function.

if (!Array.prototype.dedupe) {
  Array.prototype.dedupe = function (type) {
    for (var i = 0, l = this.length - 1; i < l; i++) {
      if (this[i][type] === this[i + 1][type]) {
        this.splice(i, 1);
        i--; l--;
      }
    }
    return this;
  }
}

function combine(arr1, arr2, key) {
  return arr1
    .concat(arr2)
    .sort(function (a, b) { return a[key] - b[key]; })
    .dedupe(key);   
}

var combined = combine(arr1, arr2, 'apple');

JSFiddle Example.

Checking and merging arrays in Javascript

Answer №1

Answer №2

Similar questions

Reinitializing AngularJS form controls

Observing Gulp's behavior is quite peculiar - it seems to be running

What are the best techniques for using jQuery to manipulate an HTML form that contains nested elements?

Tables that respond to changes in screen size, allowing nested table cells to inherit widths

Styles in makeStyles use unique css names

Retrieve specific JSON information

Mastering MongoDB update functions in JavaScript

Upon initialization, navigate to the specified location in the route by scrolling

What is the process for defining custom properties for RequestHandler in Express.js middleware functions?

Stop the click event using a confirmation dialog before proceeding with the operation

What steps do I need to take to retrieve my paginated data from FaunaDB in a React frontend application?

Utilizing React Material UI for form validation with error handling and informative helper text

What could be the reason my mat-form-field is not displaying the label?

Do I need to provide my email and password while using the Firebase signInWithGoogle()?

Jade console.log() not functioning properly as anticipated

Maintain the state of various panels on page load with the Bootstrap Accordion feature

on clicking GTM, obtain a different child element

Custom pagination with onSelectionModelChange in React Material UI Data Grid

The jQuery function fails to execute when the script source is included in the head of the document

While attempting to run the project I downloaded from GitHub using the command npm run serve, I encountered the following error: "Syntax Error: Error: No ESLint configuration found in