The Object.fromEntries() Method in JavaScript

The Object.fromEntries() method converts a list of key-value pairs into an object. It is a standard built-in JavaScript object's method to operate an array. This function creates a brand-new object whose properties are determined by the iterable's entries.

Syntax:

The following syntax is used in the JavaScript tag.

Explanation

The only parameter this function allows is an iterable, such as an array, map, or object that follows the iterable protocol.
A new object with properties provided by the iterable's entries is returned by the Object.fromEntries() method.
The iterable provides an iterator object that generates key-value pairs using the Object.fromEntries(). It uses the key as the object's property key and the value as its corresponding value.
The Object.fromEntries() function executes Object.entries in reverse().
Return value: The iterable's entries serve as the basis for a new object that this function always returns.

Examples

The examples display the Object.fromEntries() method with different types of input values. We can see the array, map, and other data convert into the object using the method.

Example 1: the following example shows the basic Object.fromEntries() method for the array values. We use a basic array with the integer key and string values.

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title> The Object.fromEntries() Method in JavaScript </title>
</head>
<body>
<h3> The Object.fromEntries() Method in JavaScript </h3>
<p> This function creates a brand-new object whose properties are determined by the iterable's entries. </p>
<b> Please See the Console Tab. </b>
<script>
const arr_data = [
[1, "java"], 
[2, "PHP"], 
[3, "Angular"], 
[4, "Javascript"], 
[5, "sample"],
];
const personal_data = Object.fromEntries(arr_data);
console.log(" The Object.fromEntries() Method in JavaScript  ");
console.log(personal_data);
</script>
</body>
</html>

Output

The output shows in the console tab with the array data.

The Object.fromEntries() Method in JavaScript

Example 2: the following example shows the basic Object.fromEntries() method for the array values. We use a basic array with the string key and various values in the map variable.

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title> The Object.fromEntries() Method in JavaScript </title>
</head>
<body>
<h3> The Object.fromEntries() Method in JavaScript </h3>
<p> This function creates a brand-new object whose properties are determined by the iterable's entries. </p>
<b> Please See the Console Tab. </b>
<script>
const arr_data = [
    ['firstName', 'Sonoo'],
    ['lastName', 'Jaiswal'],
    ['Website', 'JavaTpoint'],
    ['Company', 'Online'],
    ['Rank', 1],
];
const personal_data = Object.fromEntries(arr_data);
console.log(" The Object.fromEntries() Method in JavaScript  ");
console.log(personal_data);
</script>
</body>
</html>

Output

The output shows in the console tab with the array data.

Example 3: the following example shows the basic Object.fromEntries() method for the map values. We use a basic array with the integer key and string values in the map variable.

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title> The Object.fromEntries() Method in JavaScript </title>
</head>
<body>
<h3> The Object.fromEntries() Method in JavaScript </h3>
<p> This function creates a brand-new object whose properties are determined by the iterable's entries. </p>
<b> Please See the Console Tab. </b>
<script>
const configuration_var = new Map();
configuration_var.set(1, "java");
configuration_var.set(2, "PHP");
configuration_var.set(3, "Javascript");
configuration_var.set(4, "sample");
configuration_var.set(5, "Angular");
const personal_data = Object.fromEntries(configuration_var);
console.log(" The Object.fromEntries() Method in JavaScript  ");
console.log(personal_data);
</script>
</body>
</html>

Output

The output shows in the console tab with the map data.

Example 4: the following example shows the basic Object.fromEntries() method for the map values.

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title> The Object.fromEntries() Method in JavaScript </title>
</head>
<body>
<h3> The Object.fromEntries() Method in JavaScript </h3>
<p> This function creates a brand-new object whose properties are determined by the iterable's entries. </p>
<b> Please See the Console Tab. </b>
<script>
const configuration_var = new Map();
configuration_var.set('firstName', 'Sonoo');
configuration_var.set ('lastName', 'Jaiswal');
configuration_var.set ('Website', 'JavaTpoint');
configuration_var.set('Company', 'Online');
configuration_var.set ('Rank', 1);
configuration_var.set(3, "Javascript");
const personal_data = Object.fromEntries(configuration_var);
console.log(" The Object.fromEntries() Method in JavaScript  ");
console.log(personal_data);
</script>
</body>
</html>

Output

The output shows in the console tab with the map data.

Example 5: the following example shows the basic Object.fromEntries() method for the URL parameters.

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title> The Object.fromEntries() Method in JavaScript </title>
</head>
<body>
<h3> The Object.fromEntries() Method in JavaScript </h3>
<p> This function creates a brand-new object whose properties are determined by the iterable's entries. </p>
<b> Please See the Console Tab. </b>
<script>
const param_variable = 'type=learnongg&page=10&rows=50';
const search_data = new URLSearchParams(param_variable);
const personal_data = Object.fromEntries(search_data);
console.log(" The Object.fromEntries() Method in JavaScript  ");
console.log(personal_data);
</script>
</body>
</html>

Output

The output shows in the console tab with the url Parameters.