Introduced in ES8, the Object.entries()
method takes an object as an argument and returns an array of object's enumerable property [key, value]
pairs. The following is true about the array resulting from Object.entries()
:
- Each element of the array is guaranteed to itself be an array consisting of
key
andvalue
; - Only enumerable properties of object are included;
- Iterating through an
Object
is possible; - The order is not guaranteed;
- Non-object arguments are coerced to an object;
- Can be used to convert
Object
into aMap
.
Each Element of the Array Is Guaranteed to Itself be an Array of Key-Value
The Object.entries()
returns an array of object's enumerable property [key, value]
pairs. For example:
const obj = { foo: 'bar', baz: 'qux', waldo: 'fred' };
const objEntries = Object.entries(obj);
console.log(objEntries); // output: [ ['foo', 'bar'], ['baz', 'qux'], ['waldo', 'fred'] ]
It is important to note that object property names are always string or Symbol
. All other types of values (such as number, boolean, etc.) are coerced to a string. For example:
const obj = { false: 'foo', 10: 'bar' };
const objEntries = Object.entries(obj);
console.log(objEntries); // output: [ ['10', 'bar'], ['false', 'foo'] ]
In the example above, notice how the keys are coerced to a string.
Only Enumerable Properties of Object are Included
Array resulting from Object.properties()
only includes enumerable properties of the object. For example:
const obj = { bar: 'baz' };
Object.defineProperty(obj, 'foo', {
value: 123,
enumerable: false,
});
console.log(Object.entries(obj)); // [ ['bar', 'baz'] ]
Iterating Through an Object
Is Possible
You can easily iterate through an object by using Object.entries()
with any loop because you essentially have an array of arrays that contain a key and value. However, the easiest way to iterate through object entries is to use for...of
loop. For example:
const obj = { foo: 'bar', baz: 'qux', waldo: 'fred' };
// using destructuring syntax
for (const [key, value] of Object.entries(obj)) {
console.log(key, value);
}
// without using destructuring syntax
for (const entry of Object.entries(obj)) {
console.log(entry[0], entry[1]);
}
// output:
// foo bar
// baz qux
// waldo fred
Similarly, you can use forEach()
as well (which has better browser support):
const obj = { foo: 'bar', baz: 'qux', waldo: 'fred' };
// using destructuring syntax
Object.entries(obj).forEach(([key, value]) => {
console.log(key, value);
});
// without using destructuring syntax
Object.entries(obj).forEach((entry) => {
console.log(entry[0], entry[1]);
});
// output:
// foo bar
// baz qux
// waldo fred
Iterate Only Over the Keys:
To iterate only over the keys, you can use the destructuring syntax like so:
for (const [key] of Object.entries(obj)) {
console.log(key); // output: foo, baz, waldo
}
Object.entries(obj).forEach(([key]) => {
console.log(key); // output: foo, baz, waldo
});
Iterate Only Over the Values:
To iterate only over the values, you can use the destructuring syntax like so:
for (const [, value] of Object.entries(obj)) {
console.log(value); // output: bar, qux, fred
}
Object.entries(obj).forEach(([, value]) => {
console.log(value); // output: bar, qux, fred
});
The Order Is Not Guaranteed
Prior to ES11, Object.entries()
did not guarantee the order of the resulting array. However, from ES11+, the Object.entries()
has the same ordering as for...in
loop.
For example:
const sym = Symbol('a');
const obj = { foo: 'bar', 123: 'baz', 0: 'qux', [sym]: 'quux' };
console.log(Object.entries(obj)); // [['0', 'qux'], ['123', 'baz'], ['foo', 'bar']]
To guarantee the ordering of the object entries, can simply sort the resulting array or use a Map()
instead.
Non-Object Arguments are Coerced to an Object
If a non-object argument is supplied to Object.entries()
it will be coerced to an object. For any primitive types (except for strings) this would return an empty array. For example:
console.log(Object.entries('foo')); // output: [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]
console.log(Object.entries(100)); // output: []
Can Be Used to Convert Object Into a Map
Since the Map
object constructor accepts an iterable of entries, you can simply pass object entries as an argument to convert an Object
to Map
. For example:
const obj = { foo: 'bar', baz: 'qux' };
const map = new Map(Object.entries(obj));
console.log(map); // output: Map(2) { "foo" => "bar", "baz" => "qux" }
This post was published (and was last revised ) by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.