Home » JavaScript Tutorial » JavaScript Object.fromEntries()

JavaScript Object.fromEntries()

Summary: in this tutorial, you will learn how to use the JavaScript Object.fromEntries() method to transform a list of key-value pairs into an object.

ES6 introduces the Object.entries() method that allows you to transform an object into an array:

const boxStyle = {
    color: 'red',
    borderWidth: '1px'
};

let arr = Object.entries(boxStyle);
console.log(arr);

Output:

[['color', 'red'],['borderWidth', '1px']]

But what if you wanted to do the opposite and convert a list of key-value pairs into an object?

ES2019 introduced the Object.fromEntries() method that allows you to easily convert a list of key-value pairs into an object.

let arr = [['color', 'red'],['borderWidth', '1px']];
let obj = Object.fromEntries(arr);

Output:

{color: "red", borderWidth: "1px"}

Introduction to JavaScript Object.fromEntries() method #

The Object.fromEntries() accepts an iterable such as Array or Map and transforms it into an Object:

Object.fromEntries(iterable);

The Object.fromEntries() returns a new object whose properties are specified by the entries of the iterable.

The Object.fromEntries() expects the iterable to return an iterator object that produces key-value pairs. It uses the key as the property key of the object and value as the value associated with the property key.

The Object.fromEntries() performs the reverse of Object.entries().

JavaScript Object.fromEntries() examples #

Let’s take some examples of using the Object.fromEntries() method.

1) Converting an Array to an Object #

This example shows how to convert an array into an object:

const arr = [
    ['firstName', 'John'],
    ['lastName', 'Doe'],
    ['age', 20]
];

const person = Object.fromEntries(arr);
console.log(person);

Output:

{firstName: "John", lastName: "Doe", age: 20}

2) Converting a Map to an Object #

The following example shows how to use the Object.fromEntries() method to convert a Map to an Object:

const config = new Map();

config.set('type', 'database');
config.set('duration', 30);


const cache = Object.fromEntries(config);
console.log(cache);

Output:

{type: "database", duration: 30}

3) Converting a URL parameter string into an object #

The following example shows how to use the Object.fromEntries() to convert a query string of a URL to an object whose each property is a parameter:

const params = 'type=listing&page=2&rowCount=10';
const searchParams = new URLSearchParams(params);

console.log(Object.fromEntries(searchParams));

Output:

{type: "listing", page: "2", rowCount: "10"}

Summary #

  • The Object.fromEntries() transform an iterable into an object.
  • The Object.fromEntries() performs the reverse of Object.entries().

Was this helpful?