JavaScript Index inside map() Function
In JavaScript, the map() function’s callback provides an optional second parameter, the index, representing the current element's position in the array. This index starts at 0 and increments for each element, allowing access to each item’s position during iteration.
Syntax:
array.map(function(currentelement, index, arrayobj) {
// Returns the new value instead of the item
});
Parameters: The Index inside function accepts three parameters as mentioned above and described below:
- currentelement: The currentelement is a required argument in the map() which is the value of the current element.
- index: The index is an optional argument map() which is an array index of provided current element.
- arrayobj: The arrayobj is an optional argument in the map() which is the array object where the current element belongs.
Example 1: In this example we use map() to iterate over the student array. It alerts each student's name and their position in the top 5 ranks, incrementing the index by 1 for display.
let student = ["Arun", "Arul",
"Sujithra", "Jenifer",
"Wilson"];
student.map((stud, index) => {
alert("Hello... " + stud + "\n");
let index = index + 1;
alert("Your Position in Top 5"
+ " Rank is " + index + "\n");
});
Output:
Example: In this example we use map() to iterate over the webname array, displaying each element with a line break on the webpage and logging each element with its index to the console.
let webname = ["welcome", "to",
"GeeksforGeeeks"];
webname.map((web, index) => {
document.write(web + "<br>");
});
// check in console
webname.map((web, index) => console.log(web, index));
Output:
welcome 0
to 1
GeeksforGeeeks 2
Supported Browsers: The browsers supported by the Index inside map() function are listed below: