DEV Community

Madhavan G
Madhavan G

Posted on

JavaScript Array Iterations.

What is Iteration?
Iterations refer to the process of repeating a block of code multiple times, usually using loops. It’s a fundamental concept used when you want to perform the same operation over a collection of data or until a condition is met.

JavaScript Array Iterations:

  1. Array forEach
  2. Array map()
  3. Array flatMap()
  4. Array filter()
  5. Array reduce()
  6. Array reduceRight()
  7. Array every()
  8. Array some()
  9. Array from()
  10. Array keys()
  11. Array entries()
  12. Array with()
  13. Array Spread (...)
  14. Array Rest (...)

⇒Array forEach:

•The forEach() method calls a function (a callback function) once for each array element.
Example:
let nums = [1, 2, 3];
nums.forEach(n => console.log(n * 2));

Note that the function takes 3 arguments:

  • The item value
  • The item index
  • The array itself
  • When a callback function uses only the value parameter, the index and array parameters can be omitted

Screenshot of the program:
for each


⇒Array map():

  • The map() method creates a new array by performing a function on each array element.
  • The map() method does not execute the function for array elements without values.
  • The map() method does not change the original array.

Example:

let nums = [1, 2, 3, 4, 5];
let doubled = nums.map(n => n * 2);
console.log(doubled);

Screenshot of the program:


⇒Array flatMap():
•The flatMap() method first maps all elements of an array and then creates a new array by flattening the array.

Example:

let arr = [1, 2, 3, 4, 5];
let result = arr.flatMap(n => [n, n * 2]);
console.log(result);

Screenshot of the program:


⇒Array filter():
•The filter() method creates a new array with array elements that pass a test.

Example:

let nums = [1, 2, 3, 4];
let even = nums.filter(myFunction);
console.log(even);
function myFunction(value){
return (value%2===0)
}

Screenshot of the program:


⇒Array reduce():

  • The reduce() method runs a function on each array element to produce a single value.
  • The reduce() method works from left-to-right in the array. See also reduceRight().
  • The reduce() method does not reduce the original array.
  • In reduce(), the callback function is called for every element, and it receives 4 arguments:

array.reduce((accumulator, currentValue, index, array) =>
{
// logic
}, initialValue);

  1. accumulator (acc):

👉The running result
•Stores the result from previous steps
•Updated and passed forward each iteration

2.currentValue (n / item):

👉 The current array element

3.index (optional):

👉 Position of current element

4.array (optional):

👉 Original array itself

Example:

let nums = [1, 2, 3, 4];
let sum = nums.reduce(myFunction,0)
function myFunction(acc,n){
return acc+n;
}
console.log(sum)

// In arrow funtion
let nums = [1, 2, 3, 4];
let sum = nums.reduce((acc, n) => acc + n, 0);
console.log(sum);//10

Screenshot of the program:


⇒Array reduceRight():

  • The reduceRight() method runs a function on each array element to produce a single value.
  • The reduceRight() works from right-to-left in the array. See also reduce().
  • The reduceRight() method does not reduce the original array.

Example:
let arr = ["1", "2", "3", "4"];
let result = arr.reduceRight(myFunction)
function myFunction(acc,n){
return acc+n;
}
console.log(result)

//In arrow funtion
let arr = ["1", "2", "3","4"];
let result = arr.reduceRight((acc, val) => acc + val);
console.log(result);

Screenshot of the program:


⇒Array every():

•The every() method checks if all array values pass the condition.

Example:

const numbers = [45, 4, 9, 16, 25];
let result = numbers.every(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
console.log(result)

// In arrow funtion
// let number = [45,4,8,16,25];
// let result = number.every((val) =>val>18);
// console.log(result);

What does every() do?

👉 every() checks:

“Do ALL elements satisfy the condition?”

✔ If ALL are true → returns true
❌ If even ONE is false → returns false

Screenshot of the program:


Top comments (0)