Lets see how javascript map method works using some examples, some real world problem, Interview question and lastly there is a task for you 🙂
This is an array method which iterate over the array, map values and then return a new array.
Let’s see the syntax of same
Array.map(callbackFunction(currentValue, [index], [arr]);
- callback function – the method that will do the work
- currentValue – the current value of array element
- index – the current index of element
- arr – the reference of the array
- And finally this will return a new mapped array
Let’s see an example
var newArr = arr.map(function(value, index, arr){
console.log(“value: “+ value);
console.log(“index:”+index);
console.log(arr);
return 2 * value;
});
console.log(newArr);
This will print below things
So all the element and their index got printed, and finally a new array has been returned where each element is twice of original array element.
Some real world problem which can be solved using map method
- We have an array of scores and we need to convert that into percentages
- We have an array of numbers but all are in form of string, something like this
Arr = [“1”, “2”, “3”] -> so we can parse each and every element to int and then return
- Adding extra element on already present json array
Interview questions?
- What is the difference between map and filter?
- When not to use map method
- Whenever we don’t need the return value of map. Its better to use foreach at that time
Task for you
var arr = [’10’, ’10’, ’10’];
arr = arr.map(parseInt)
console.log(arr)
Write down in comment box – what will be the output of this. And let’s discuss there.
Video tutorial for same