Object.entries() method in JavaScript

JavaScript Object.entries() method: Here, we are going to learn about the entries() method of Object class in JavaScript with examples.
Submitted by Siddhant Verma, on November 25, 2019

We know that everything in JavaScript is an object. It's essential to get the hang of the ways we can play around these objects, traverse them, sort them, access the key-value pairs and values individually so we can get comfy with using them in our application.

Open the chrome dev console to try out the examples by right-clicking on the browser → selecting inspect → selecting console or simply type f12.

Consider the following object,

let squirtle= {
	'type': 'Water', 
	HP: 100, 
	isEvolved: false, 
	'Favorite': 'Jigglypuff'
}
console.log(squirtle);

Output

{type: "Water", HP: 100, isEvolved: false, Favorite: "Jigglypuff"}
Favorite: "Jigglypuff"
HP: 100
isEvolved: false
type: "Water"
__proto__: Object

Let's say we want to iterate over the values on this object. We can use the object.values() method.

console.log(Object.values(squirtle));

Output

(4) ["Water", 100, false, "Jigglypuff"]
0: "Water"
1: 100
2: false
3: "Jigglypuff"
length: 4
__proto__: Array(0)

What if we want to iterate over the individual key value pairs? Here, we make use of the object.entries() method.

console.log(Object.entries(squirtle));

Output

(4) [Array(2), Array(2), Array(2), Array(2)]
0: (2) ["type", "Water"]
1: (2) ["HP", 100]
2: (2) ["isEvolved", false]
3: (2) ["Favorite", "Jigglypuff"]
length: 4
__proto__: Array(0)

Using the object.values() method we get an array with all the values inside it. With object.entries() method we get an array of arrays where each array contains the individual key-value pairs inside it.

let myPokemon = Object.entries(squirtle);
console.log(myPokemon);
console.log(myPokemon[0]);

Output

(4) [Array(2), Array(2), Array(2), Array(2)]
(2) ["type", "Water"]

We can access any key-value pairs using the index in this array. Thus we can say that Object.entries() method returns an array consisting of enumerable property [key, value] pairs of the object whose ordering is the same as that given by looping over the property values of the object manually. We can use this method for listing properties as well as all the key-value pairs of an object.

We can now define a general syntax for this method as,

    object.entries(<name of the object>);

It takes in an object as a parameter and returns us an array.

myPokemon.forEach(prop => {
    console.log(prop);
})

Output

(2) ["type", "Water"]
(2) ["HP", 100]
(2) ["isEvolved", false]
(2) ["Favorite", "Jigglypuff"]