Bonjour tech-nerd !!
In this blog we'll see about some important must known array methods of javascript.
Content
1. Array in general
2. Why methods?
3. forEach()
4. Map()
5. Filter()
6. Reduce()
Lets get started 🎉
1. Array
Array is a collection/list of data stored in a single variable.
Syntax1: const arrayName = new Array(item1, item2, item3...);
Syntax2: const arrayName = [item1, item2, item3...];
Array Creation & accessing:
const games = ["Football","Cricket", "Snake&Ladders","Ludo"];
//indexing
console.log(games[1]); //Books
//using for-loop
for(let i=0;i<games.length; i++){
console.log(i);
}
//Output:
Football
Cricket
Snake&Ladders
Ludo
2. Why methods?
Methods are predefinded function to access and modify array elements efficiently. There more array methods avialable. But we only see some.
3. forEach()
Basically for and forEach() both does the same this i.e to iterate through the array. The only difference is that
forEach()
uses callback function wherefor
loops through the array sequentially.
const hobbie = ["Photography","Books", "Music"]; hobbie.forEach((item)=>{ console.log(item); });
- Output:
Photography Books Music
For vs forEach()
For | forEach() |
Supports break statement | Do not supports break statement |
Ordinary loop itertion | Irerates by callback function |
Faster performance | Slower performance |
At the end of the day, both does the similar operation. It only depends on your personal preference.
4. Map()
map() method works same as the forEach but as the callback function hits every element it creates a new array with upcomming the result.
const nums = [1,2,3,4,5]; var result=nums.map((item)=>{ return item*2; }); console.log(result);
- Output:
[2,4,6,8,10]
5. Filter()
filter() method creates a new array from a given array which satisfy a given condition.
const nums = [1,2,3,4,5,6,7,8,9,10]; var result=nums.filter((item)=>{ return (item%2==0); // returns even number }); console.log(result);
- Output:
[2,4,6,8,10]
6. Reduce()
As the name insists reduce() method reduce the array to a single value as per the reducer function. It takes two required param
total and current value
.
// sumof all elements const nums = [1,2,3,4,5,6,7,8,9,10]; const sum = nums.reduce((total, curr) =>{ //params can be named anything. return (total + curr); }); console.log(sum);
- Output:
55
Alright nerds! Thats it for now, hope it helped. Thanks for reading. Stay tuned!! See you👋.