DEV Community

Cover image for JavaScript Array Iteration Methods: A Complete Guide to forEach(), map(), and filter()
Vinayagam
Vinayagam

Posted on

JavaScript Array Iteration Methods: A Complete Guide to forEach(), map(), and filter()

1.forEach() in JavaScript:

Definition
forEach() is an array method in JavaScript that executes a function once for each element in an array.
👉 It is used for looping through arrays.
👉 It does not return a new array.

Syntax:
array.forEach(function(value, index, array) {
});

  • value → current element
  • index → position of element
  • array → original array

Example

let numbers = [10, 20, 30];

numbers.forEach(function(num) {
  console.log(num);
});
Enter fullscreen mode Exit fullscreen mode

Output
10
20
30

1.What is forEach() in JavaScript?
Answer:
forEach() is an array method that executes a provided function once for each element in an array. It is mainly used for iteration.

2.Print all elements of an array using forEach().
Answer:

let numbers = [5, 10, 15];
numbers.forEach(function(num) {
  console.log(num);
});
Enter fullscreen mode Exit fullscreen mode

Output:
5
10
15

3.Does forEach() return a new array?
Answer:
No, forEach() does not return a new array. It returns undefined.

4.Can we use break or continue inside forEach()?
Answer:
No, we cannot use break or continue inside forEach(). It always executes for all elements unless an error is thrown.

2.map() in JavaScript

map() is an array iteration method in JavaScript used to transform elements of an array.

Definition:
map() creates a new array by applying a function to each element of the original array.
👉 It does not change the original array.
👉 It always returns a new array.

Syntax

array.map(function(value, index, array) {
   return newValue;
});
Enter fullscreen mode Exit fullscreen mode
  • value → Current element
  • index → Position of element
  • array → Original array

1.What is map() in JavaScript?
Answer:
map() is an array method that executes a function for each element and returns a new array with transformed values.

2.Does map() modify the original array?
Answer:
No, map() does not modify the original array. It returns a new array.

3.What does map() return?
Answer:
map() returns a new array with the same length as the original array.

3.filter() in JavaScript

filter() is an array iteration method in JavaScript used to select elements based on a condition.

Definition
filter() creates a new array containing only the elements that satisfy a given condition (true).
👉 It does not modify the original array.
👉 It returns a new array.

Syntax:

array.filter(function(value, index, array) {
   return condition;
});

Enter fullscreen mode Exit fullscreen mode
  • value → Current element
  • index → Index of element
  • array → Original array
  • Must return true to include the element

1.What is filter() in JavaScript?
Answer:
filter() is an array method that creates a new array containing only the elements that pass a specified condition.

2.Does filter() modify the original array?
Answer:
No, filter() does not modify the original array. It returns a new filtered array.

3.What does filter() return?
Answer:
It returns a new array with elements that satisfy the condition. If no elements match, it returns an empty array.

Examples: Get Even Numbers

let numbers = [1, 2, 3, 4, 5, 6];

let evenNumbers = numbers.filter(function(num) {
  return num % 2 === 0;
});

console.log(evenNumbers);

Enter fullscreen mode Exit fullscreen mode

Output:

[2, 4, 6]

Top comments (0)