In this article, we are going to learn about comparing two objects to determine if the first object contains equivalent property values to the second object, In JavaScript, comparing the values of two objects involves checking if they have the same properties with corresponding values. Given two objects obj1 and obj2 and the task are to check that obj1 contains all the property values of obj2 in JavaScript.
Input: obj1: { name: "John", age: 23; degree: "CS" }
obj2: {age: 23, degree: "CS"}
Output: true
Input: obj1: { name: "John", degree: "CS" }
obj2: {name: "Max", age: 23, degree: "CS"}
Output: false
To solve this problem we follow the following approaches.
- Using for..in loop
- Using Object.keys() and Array.every()
- Using JSON.stringify()
- Using a custom function
- Using Object.entries()
We will explore all the above methods along with their basic implementation with the help of examples.
Approach 1: Using for..in loop
It is a naive approach to solve this problem. In this approach, we iterate the obj2 using the for..in loop, and at every iteration, we check the current key of both objects are not equal we return false otherwise after completion the loop we return true.
Example: In this example, we are using the above-explained approach.
Javascript
// Define the first object let obj1 = { name: "John" , age: 23, degree: "CS" } // Define the second object let obj2 = { age: 23, degree: "CS" } // Define the function check function check(obj1, obj2) { // Iterate the obj2 using for..in for (key in obj2) { // Check if both objects do // not have the equal values // of same key if (obj1[key] !== obj2[key]) { return false ; } } return true } // Call the function console.log(check(obj1, obj2)) |
true
Approach 2: Using Object.keys() and Array.every()
In this approach, we create an array of all the keys of obj2 by using the Object.keys() method and then using the Array.every() method we check if all the properties of obj2 are equal to obj1 or not.
Example: In this example, we are using the above-explained approach.
Javascript
// Define the first object let obj1 = { name: "John" , age: 23, degree: "CS" } // Define the Second object let obj2 = { age: 23, degree: "CS" } // Define the function check function check(obj1, obj2) { return Object // Get all the keys in array .keys(obj2) .every(val => obj1.hasOwnProperty(val) && obj1[val] === obj2[val]) } // Call the function console.log(check(obj1, obj2)) |
true
Approach 3: Using JSON.stringify()
In this approach, we use JSON.stringify() to convert both objects into JSON strings and then compare the strings using === for strict equality. If the objects have the same properties with the same values (regardless of the order), the strings will be equal, and the function will return true.
Example: In this example, The areObjectsEqual function compares two objects obj1 and obj2 by converting them to JSON strings. The output is true because both objects have equivalent properties and values.
Javascript
function areObjectsEqual(obj1, obj2) { const stringifiedObj1 = JSON.stringify(obj1); const stringifiedObj2 = JSON.stringify(obj2); return stringifiedObj1 === stringifiedObj2; } let obj1 = { name: "John" , age: 23, degree: "CS" }; let obj2 = { name: "John" , age: 23, degree: "CS" }; console.log(areObjectsEqual(obj1, obj2)); |
true
Approach 4: Using a custom function
In this approach, we define the areObjectsEqual function, which compares two objects obj1 and obj2. It first checks if the number of keys in both objects is the same; if not, it returns false.
Example: In this example, we are using a custom function areObjectsEqual, the example compares two objects obj1 and obj2, returning true as they have equivalent properties and values.
Javascript
function areObjectsEqual(obj1, obj2) { const keys1 = Object.keys(obj1); const keys2 = Object.keys(obj2); if (keys1.length !== keys2.length) { return false ; } for (const key of keys1) { if (obj1[key] !== obj2[key]) { return false ; } } return true ; } let obj1 = { name: "John" , age: 23, degree: "CS" }; let obj2 = { name: "John" , age: 23, degree: "CS" }; console.log(areObjectsEqual(obj1, obj2)); |
true
Approach 5: Using Object.entries()
In this approach, we use Object.entries() to obtain arrays of key-value pairs from both objects obj1 and obj2. We then compare the lengths of these arrays. If they are not equal, it means the objects have different numbers of properties, so we immediately return false.
Example: In this example, we are using Object.entries(), the example compares obj1 and obj2, returning true as both have equivalent properties and values.
Javascript
function areObjectsEqual(obj1, obj2) { const entries1 = Object.entries(obj1); const entries2 = Object.entries(obj2); if (entries1.length !== entries2.length) { return false ; } for (const [key, value] of entries1) { if (!obj2.hasOwnProperty(key) || obj2[key] !== value) { return false ; } } return true ; } let obj1 = { name: "John" , age: 23, degree: "CS" }; let obj2 = { name: "John" , age: 23, degree: "CS" }; console.log(areObjectsEqual(obj1, obj2)); |
true