DEV Community

Cover image for Array Iteration Methods
Kesavarthini
Kesavarthini

Posted on

Array Iteration Methods

Array Iteration Methods in JavaScript
1. forEach()

  • Executes a function for each element
  • Does NOT return a new array
let arr = [1, 2, 3];

arr.forEach(function(num) {
    console.log(num * 2);
});

Enter fullscreen mode Exit fullscreen mode

Output:

2 4 6
Enter fullscreen mode Exit fullscreen mode

Use when you just want to print / perform action

2. map()
Transforms array and returns new array

let arr = [1, 2, 3];

let result = arr.map(num => num * 2);

console.log(result); // [2, 4, 6]
Enter fullscreen mode Exit fullscreen mode

✔ Use when you want to modify values

3. flatMap()

Combines map() + flat()

let arr = [1, 2, 3];

let result = arr.flatMap(num => [num, num * 2]);

console.log(result); // [1,2,2,4,3,6]
Enter fullscreen mode Exit fullscreen mode

✔ Use when returning arrays inside map

4. filter()

Returns elements that match condition

let arr = [1, 2, 3, 4];

let result = arr.filter(num => num % 2 === 0);

console.log(result); // [2, 4]
Enter fullscreen mode Exit fullscreen mode

✔ Use for selection

5. reduce()(To be discussed)
Reduces array to single value

let arr = [1, 2, 3, 4];

let sum = arr.reduce((acc, num) => acc + num, 0);

console.log(sum); // 10
Enter fullscreen mode Exit fullscreen mode

✔ Use for sum, product, etc.

6. reduceRight()(To be discussed)
Same as reduce but from right → left

let arr = ["a", "b", "c"];

let result = arr.reduceRight((acc, val) => acc + val);

console.log(result); // "cba"
Enter fullscreen mode Exit fullscreen mode

7. every()
Checks if ALL elements satisfy condition

let arr = [2, 4, 6];

let result = arr.every(num => num % 2 === 0);

console.log(result); // true
Enter fullscreen mode Exit fullscreen mode

8. some()
Checks if ANY element satisfies condition

let arr = [1, 3, 4];

let result = arr.some(num => num % 2 === 0);

console.log(result); // true
Enter fullscreen mode Exit fullscreen mode

9. Array.from()
Converts iterable → array

let str = "hello";

let arr = Array.from(str);

console.log(arr); // ["h","e","l","l","o"]
Enter fullscreen mode Exit fullscreen mode

10. keys()(To be discussed)
Returns index iterator

let arr = ["a", "b"];

for (let key of arr.keys()) {
    console.log(key);
}
Enter fullscreen mode Exit fullscreen mode

Output:

0 1
Enter fullscreen mode Exit fullscreen mode

11. entries()
Returns index + value

let arr = ["a", "b"];

for (let [index, value] of arr.entries()) {
    console.log(index, value);
}
Enter fullscreen mode Exit fullscreen mode

Output:

0 a
1 b
Enter fullscreen mode Exit fullscreen mode

12. with()
Returns new array with replaced value

let arr = [1, 2, 3];

let newArr = arr.with(1, 100);

console.log(newArr); // [1,100,3]
Enter fullscreen mode Exit fullscreen mode

✔ Does NOT modify original

13. Spread Operator(To be discussed)
Expands array

let arr1 = [1, 2];
let arr2 = [3, 4];

let result = [...arr1, ...arr2];

console.log(result); // [1,2,3,4]
Enter fullscreen mode Exit fullscreen mode

✔ Used for copying, merging

14. Rest Operator ...(To be discussed)
Collects values into array

function sum(...nums) {
    return nums.reduce((a, b) => a + b);
}

console.log(sum(1, 2, 3)); // 6
Enter fullscreen mode Exit fullscreen mode

Top comments (0)