What is the best way to compare keys and values in a JSON object in Lodash when one object contains additional keys?

Question

What is the best way to compare keys and values in a JSON object in Lodash when one object contains additional keys?

Consider the following two JSON objects:

var obj1 = {a: "apple", b: "banana", c: "carrot"}
var obj2 = {a: "apple", e: “egg” b: "banana", c: "carrot", d: "dog"}

I'm looking for a way to compare these objects using a Boolean check without altering any of their data. In this scenario, the comparison should yield true because the values of matching keys in both objects are identical.

Now, let's suppose the first object (obj1) remains the same, but the second one (obj2) is as follows:

var obj1 = {a: "apple", b: "banana", c: "carrot"}
var obj2 = {a: "ant", e: “egg” b: "banana", c: "carrot", d: "dog"}

In this case, the Boolean check should return false because the value associated with key a does not match, even though some other fields do and some are exclusive to one object.

Any suggestions on how to approach this? I'd prefer utilizing Lodash due to its comprehensive feature set. Initially, I tried using _.isEqual(obj1, obj2), but it didn't meet my specific requirements.

javascript json compare lodash

Answer 1

Answer №1

Not sure if there is a built-in method in lodash for this specific task, but you can easily achieve the desired outcome using the Object.entries and Array.every methods.

var objA = {
  x: "x-ray",
  y: "yellow",
  z: "zebra"
}
var objB = {
  x: "x-ray",
  y: "yellow",
  z: "zebra",
  w: "whale",
  u: "umbrella"
}


var objC = {x: "x-ray", y: "yellow", z: "zebra"}
var objD = {x: "xylophone", u: "umbrella" ,y: "yellow", z: "zebra", w: "whale"}

function compareObjects(firstObj, secondObj) {
  const entriesFirst = Object.entries(firstObj);
  const entriesSecond = Object.entries(secondObj);

  const shorterArray = entriesFirst.length > entriesSecond ? entriesSecond : entriesFirst; // find the shorter array
  const longerArray = shorterArray === entriesFirst ? secondObj : firstObj;

  const areEqual = shorterArray.every(([key, value]) => longerArray[key] === value);
  return areEqual;

}



console.log(compareObjects(objA, objB))
console.log(compareObjects(objC, objD))

Answer 2

Not sure if there is a built-in method in lodash for this specific task, but you can easily achieve the desired outcome using the Object.entries and Array.every methods.

var objA = {
  x: "x-ray",
  y: "yellow",
  z: "zebra"
}
var objB = {
  x: "x-ray",
  y: "yellow",
  z: "zebra",
  w: "whale",
  u: "umbrella"
}


var objC = {x: "x-ray", y: "yellow", z: "zebra"}
var objD = {x: "xylophone", u: "umbrella" ,y: "yellow", z: "zebra", w: "whale"}

function compareObjects(firstObj, secondObj) {
  const entriesFirst = Object.entries(firstObj);
  const entriesSecond = Object.entries(secondObj);

  const shorterArray = entriesFirst.length > entriesSecond ? entriesSecond : entriesFirst; // find the shorter array
  const longerArray = shorterArray === entriesFirst ? secondObj : firstObj;

  const areEqual = shorterArray.every(([key, value]) => longerArray[key] === value);
  return areEqual;

}



console.log(compareObjects(objA, objB))
console.log(compareObjects(objC, objD))

Answer 3

Answer №2

Utilize the <code>_.isMatch function for assistance. Please refer to the code snippet below:

var object1 = {
  name: "John",
  age: 25,
  city: "New York"
}
var object2 = {
  name: "John",
  gender: "Male",
  age: 25,
  city: "New York",
  occupation: "Engineer"
}

console.log(_.isMatch(object2, object1));

var obj1 = {
  color: "blue",
  size: "large",
}
var obj2 = {
  color: "red",
  material: "cotton",
  size: "small",
}

console.log(_.isMatch(obj2, obj1));

<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="97fbf8f3f6e4fff7d3bdc7d8dec7dbd9">[email protected]</a>/lodash.min.js"></script>

Please note that _.isMatch(obj1, obj2) will not provide the desired outcome. An additional logic check is required to determine which object contains more keys and should be passed as the first argument.

Answer 4

Utilize the <code>_.isMatch function for assistance. Please refer to the code snippet below:

var object1 = {
  name: "John",
  age: 25,
  city: "New York"
}
var object2 = {
  name: "John",
  gender: "Male",
  age: 25,
  city: "New York",
  occupation: "Engineer"
}

console.log(_.isMatch(object2, object1));

var obj1 = {
  color: "blue",
  size: "large",
}
var obj2 = {
  color: "red",
  material: "cotton",
  size: "small",
}

console.log(_.isMatch(obj2, obj1));

<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="97fbf8f3f6e4fff7d3bdc7d8dec7dbd9">[email protected]</a>/lodash.min.js"></script>

Please note that _.isMatch(obj1, obj2) will not provide the desired outcome. An additional logic check is required to determine which object contains more keys and should be passed as the first argument.

What is the best way to compare keys and values in a JSON object in Lodash when one object contains additional keys?

Answer №1

Answer №2

Similar questions

Having trouble accessing an injector service within the promise of a dynamically loaded JavaScript function that has been assigned to a global variable

Checking for correct HTML tags using JavaScript

Is there a way to prevent downloaded files from becoming corrupted?

Navigating pinch to zoom: Strategies for managing varying page locations

The arrangement of a JSON array can be modified by AngularJS' Ng-repeat functionality

Switching from AngularJS to vanilla JavaScript or integrating AngularJS and Flask on a single server

Combining two sets of elements in Java to form a Json using Jackson

Creating a concise TypeScript declaration file for an established JavaScript library

What is the best way to implement a prev.next function in an image gallery using an array in JavaScript?

Submitting a JSPX form to interact with PHP backend

Utilizing AngularJS for Showcasing JSON Information Using Ng-Repeat and Ng-Factory

I created a custom function that combines two arrays into one, but I am encountering an error stating "Unable to access properties of undefined."

Error message issued by a JSON response indicating an invalid email address while utilizing the PHP GET method within the SendGrid API

Incorporating a GLTF Model in a Basic React Three Fiber Environment

"Effortlessly handle adding and removing items with a single button using

Iterating through a JSON dataset of various clothing items to search for a specific keyword within the product titles

Data vanished from the input field values

Ways to show alternative data from a database in Laravel 8

TS2688 Error: Type definition file for 'tooltip.js' not found

What is the proper method for retrieving data using the "current_page" and "timeline" parameters now that the API structure has been updated to only allow objects instead of arrays?