Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to invert an object in JavaScript?
Invert means to print the value in reverse order. In a technical word, we can say that suppose we have taken an object of the array. The object takes the value in key-value pairs and prints the value in value-key pairs.
The _.invert() function belongs to the underscore.js a javascript library that provides versatile functions.
This is used to copy an object where the object key is converted into value and the object is converted into the key. This means the [key, value] of the object is reversed.
Syntax
Following is the syntax of the _.invert() function −
_.invert(object)
Object − Object is the key-value pairs of an array.
Return − it returns the [key, value] of an object in reverse order [value,key].
Example: 1
In the following example we are creating an object named obj, passing the obj var in the _.invert() function, and returning the value in value−key pairs.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var obj = {
Company: "TurorialsPoint",
Address: "Hyderabad",
Contact: "+917654980321",
Email: "xyz123@gmail.com",
};
document.write(JSON.stringify(_.invert(obj)));
</script>
</body>
</html>
Example 2
In the following example, we are passing an object named obj to the _.invert() function and converting it into the string to display the return data on the page.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var obj = {
num1: "91",
num2: "82",
num3: "52",
num4: "19",
};
var number = JSON.stringify(_.invert(obj));
document.write(number);
</script>
</body>
</html>
Example 3
Let us see another example of the _.invert() function −
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var detail = JSON.stringify(
_.invert({ name: "JP ANNA", age: 324, salary: 220000 })
);
document.write(detail);
</script>
</body>
</html>
Example 4: Using the arrow(=>) function
In this example, we are going to discuss the usage of arrow function. In this case, we will use the => arrow function to reverse the key/value pair of an object.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<scripttype="text/javascript"src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
<title>Invert an object</title>
<div id="invert"></div>
</head>
<body>
<script type="text/javascript">
let obj = {
name: "Alice",
age: 21,
role: "Full stack developer",
};
let invertObj = (obj) =>
Object.fromEntries(Object.entries(obj).map(([key, value]) => [value, key]));
document.getElementById("invert").innerHTML = JSON.stringify(
invertObj(obj)
);
</script>
</body>
</html>
Example 5: Using the reverse() method
In this example, we are going to invert an object in JavaScript using the reverse() method. This method is used to reverse the key/value pair of an object.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<scripttype="text/javascript"src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
<title>Invert an object</title>
<div id="invert"></div>
</head>
<body>
<script type="text/javascript">
let obj = {
name: "Alice",
age: 21,
role: "Full stack developer",
};
function invertObj(obj) {
let invert_obj = {};
reverse_obj = Object.keys(obj).reverse();
reverse_obj.forEach(function (x) {
invert_obj[x] = obj[x];
});
return invert_obj;
}
rev = invertObj(obj);
document.getElementById("invert").innerHTML = JSON.stringify(rev);
</script>
</body>
</html>
2K+ Views
