Find the variance between two arrays containing distinct elements

Question

Find the variance between two arrays containing distinct elements

I have 2 arrays with a similar structure as shown below. My objective is to compare each field and store the items from the arrays that differ in a third array.

Arr1= [{ state:CA, id:1, name:aaa, product:car, color: white}, {...}]

and so forth

Arr2= [{ id:1, name:bbb, product:car, color: white, mileage:30, type: sedan}, {...}]

and so on

Arr3= [{ state: CA, id:1, name:aaa, product:car, color: white}],

Error/result/difference = name (something along those lines)

The goal is to use the combination of id, make, product, and color as a key field for comparison with the second array. If there is a difference in any of these fields, then the entire object should be added to the third array.

Note: These two arrays have different sets of key-value pairs, with only a few common ones. The aim is to compare these common elements in each object in Arr1 with every object in Arr2, highlighting any differences.

Note#2: I am not interested in finding missing objects in either array; my focus is solely on identifying matching objects with perhaps one mismatched key value among the common keys.

The proposed solution does not align with my query. I hope I have clarified it adequately.

javascript arrays comparison difference

Answer 1

Answer №1

I found some parts of the question unclear, such as why type: sedan didn't end up in arr3. However, based on my understanding, this code should suit your requirements:

const arr1 = [
    { state: "CA", id: 1, name: "aaa", product: "car", color: "white" },
    { state: "NY", id: 2, name: "ccc", product: "bike", color: "red" },
  ];

  const arr2 = [
    { id: 1, name: "bbb", product: "car", color: "white", mileage: 30, type: "sedan" },
    { id: 2, name: "ddd", product: "bike", color: "blue", mileage: 15, type: "mountain" },
  ];

  const compare = (arr1, arr2) => {
    const result = [];

    arr1.forEach((item1, index1) => {
      const item2 = arr2.find((item2) => item1.id === item2.id);
      if (!item2) return;

      const keys1 = Object.keys(item1);
      const keys2 = Object.keys(item2);
      const commonKeys = keys1.filter(key => keys2.includes(key));

      let anyMismatch = false;

      commonKeys.forEach((key) => {
        if (item1[key] !== item2[key]) {
          anyMismatch = true;
        }
      });

      // If there is any mismatch in common keys, add the entire object from arr1 along with its index
      if (anyMismatch) {
        result.push({ ...item1, index: index1 });
      }
    });

    return result;
  };

  console.log(compare(arr1, arr2));

Answer 2

I found some parts of the question unclear, such as why type: sedan didn't end up in arr3. However, based on my understanding, this code should suit your requirements:

const arr1 = [
    { state: "CA", id: 1, name: "aaa", product: "car", color: "white" },
    { state: "NY", id: 2, name: "ccc", product: "bike", color: "red" },
  ];

  const arr2 = [
    { id: 1, name: "bbb", product: "car", color: "white", mileage: 30, type: "sedan" },
    { id: 2, name: "ddd", product: "bike", color: "blue", mileage: 15, type: "mountain" },
  ];

  const compare = (arr1, arr2) => {
    const result = [];

    arr1.forEach((item1, index1) => {
      const item2 = arr2.find((item2) => item1.id === item2.id);
      if (!item2) return;

      const keys1 = Object.keys(item1);
      const keys2 = Object.keys(item2);
      const commonKeys = keys1.filter(key => keys2.includes(key));

      let anyMismatch = false;

      commonKeys.forEach((key) => {
        if (item1[key] !== item2[key]) {
          anyMismatch = true;
        }
      });

      // If there is any mismatch in common keys, add the entire object from arr1 along with its index
      if (anyMismatch) {
        result.push({ ...item1, index: index1 });
      }
    });

    return result;
  };

  console.log(compare(arr1, arr2));

Find the variance between two arrays containing distinct elements

Answer №1

Similar questions

Toggle the class and execute the order within a jQuery script

Component fails to trigger @click handler

"Process the contents of a file by reading it line by line in a

Angular: Identifier for Dropdown with Multiple Selection

Retrieve the initial span within a <div> by using the data-id

Transitioning from an asp.mvc application to a node.js application, with a strong emphasis on enhancing the design aspects

Updating PHP query with JavaScript or jQuery: yea or nay?

An easy way to showcase Wikipedia's JSON data using JQuery

Implementing global event callback in JavaScript

What is the best way to access external value in an Angular directive?

Organizing checkboxes to store selected values in an array using Vue.js

Downloading a file through a JavaScript link in HTMLUnit: A step-by-step guide

Generating interactive sound using Node.js

What is the established procedure for resetting all elements within an (X)HTML document?

Guidelines on declining a pledge in NativeScript with Angular 2

Using ReactJS, the for loop can be utilized to dynamically create buttons and assign variables based on the integer being iter

Adding custom properties to TreeNode in PrimeNg Tree Component [Angular5]

organizing components for identical items

Creating a notification for specific choices in a dropdown menu

Prevent multiple images from continuously changing their image sources