The JavaScript Array.entries() method is used to create an iterator object that contains key-value pairs for each index in an array. Each pair consists of the index (as the key) and the value at that index in the array. The method allows you to iterate over the array and access both the index and the element at the same time.
The Array.entries() method is particularly useful when you need to loop over an array and retrieve both the index and the value, which is often needed in tasks involving data processing or formatting.
Syntax
The syntax for the Array.entries() method is given below:
array.entries()
Parameters
- The Array.entries() method does not accept any parameters.
Return Value
A new array iterator object containing key-value pairs for each index in the array.
Examples of JavaScript Array.entries() Method
Example 1: Basic Usage of Array.entries() Method
You can use the Array.entries() method to get an iterator and loop through each key-value pair in the array.
const fruits = ['apple', 'banana', 'cherry'];
const iterator = fruits.entries();
for (let entry of iterator) {
console.log(entry);
}
Explanation: The Array.entries() method creates an iterator that returns key-value pairs where the key is the index and the value is the element in the array. In this example, the key-value pairs are [0, 'apple'], [1, 'banana'], and [2, 'cherry'].
Example 2: Using Array.entries() with for...of Loop
You can use the for...of loop to easily iterate over the entries returned by the entries() method.
const colors = ['red', 'green', 'blue'];
for (const [index, color] of colors.entries()) {
console.log(`Index: ${index}, Color: ${color}`);
}
Explanation: In this example, the entries() method returns an iterator for the colors array. The for...of loop destructures the index and value from each entry and logs them.
Example 3: Accessing Array Entries Using next()
The iterator object returned by Array.entries() can be manually traversed using the next() method.
const numbers = [10, 20, 30];
const iterator = numbers.entries();
console.log(iterator.next().value);
console.log(iterator.next().value);
console.log(iterator.next().value);
console.log(iterator.next().done);
Explanation: The next() method retrieves the next key-value pair from the iterator. After all entries have been retrieved, done becomes true, indicating that there are no more entries.
Example 4: Using Array.entries() with Empty Arrays
If you call Array.entries() on an empty array, the iterator will not yield any values.
const emptyArray = [];
const iterator = emptyArray.entries();
console.log(iterator.next().done);
Explanation: Since the array is empty, the iterator immediately returns done: true, indicating that there are no entries to iterate over.
Example 5: Combining Array.entries() with Array.map()
You can use Array.entries() in combination with other array methods like map() to access both the index and the value.
const numbers = [10, 20, 30];
const result = numbers.map((value, index) => [index, value]);
console.log(result);
Explanation: In this example, although the entries() method is not directly used, map() is used to achieve a similar result, providing both the index and value as separate elements.