An array can contain thousands of data sets: lists of strings, binary numbers, floats, and so on. Therefore, what is the quickest way to retrieve some data with a specific identity?

This is where array iteration comes in. The number of visits you make to a list of data sets in a short period is referred to as an “iteration of an array.” It is more like looping through a data set or array.

You can go through an array in javascript by utilizing some methods or functions available in javascript. Read on to learn about the iteration methods you can use to loop through an array in javascript.

JavaScript Array forEach()

There are many ways to loop through an array, but one of the most popular ones is the forEach method in JavaScript. For each element of an array, the forEach() method makes a single call to a callback function.

The forEach needs the following inputs:

The current array element’s value

The index number of the current element

The element’s corresponding array object

let stud_data = ['Joe', 'anna', 'Phil', 'Bill', 'Foden', 'Silas'];
// using forEach array iteration method on the stud_data
stud_data.forEach(my_stud_Function);
function my_stud_Function(merely) {
    console.log(merely);
}

#Output
Joe
Anna
Phil
Bill
Foden
Silas

JavaScript Array map()

JavaScript array map() is also another type of method you can use to loop over an array. Additionally, a map function allows you to modify elements using what is known as a callback function. Hence, when this callback function revisits this array of elements, it updates the values with the acting instruction it gets from the function.

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

JavaScript Array.map() generates a new array by applying a function to each element of the existing array.

const ers1 = [5, 15, 60, 76, 45,8,2,56.98,097,123,100];
const ers2 = ers1.map(map_Function);
 
console.log(ers2); // output........ (11) [7.5, 22.5, 90, 114, 67.5, 12, 3, 85.47, 145.5, 184.5, 150]
 
function map_Function(value, index, array) {
  return value * 1.5;
}

JavaScript Array filter()

Just as the name, the javascript filter() method picks up certain elements that pass the test code it will test on all the elements in the array. A new array is created by the filter() method, and the array will house elements that pass the test. Therefore, using this method is similar to separating elements with a particular attribute from those without it.

An example is a user trying to pick out vowels from the list of consonants. The filter() method internally loops through the 26 alphabets, passing each element to the callback function.

An optional object and a callback function are the two named arguments that the filter() method accepts.

The format of the callback function is identical to that of the Array object’s other iterative methods, including every(), some(), map(), and forEach().

For Example:

// declare an array
const filter_numbers = [4,,21, 34, 2,6 ,7 , 8, 5, 4, 9, 16, 17, 25];
const fil_values = filter_numbers.filter(fil_Function);

console.log(fil_values); // output........... (9) [21, 34, 6, 7, 8, 9, 16, 17, 25]


// this function contains the filter method operation algorithm
function fil_Function(value, index, array) {
  return value > 5;
}

JavaScript Array Every() and Some()

The JavaScript array some() is used to check the elements in an array that meet the criteria for a particular operation. Array every() checks if the entire array adheres to a certain structure, and some() does the opposite.

You can use these two methods interchangeably on projects that demand all elements of an array pass a test or a few of them.

Examples

// every() example
// declare an array
const every_num = [49.5,21, 34, 80,60 ,74 , 82, 53, 48, 96, 16, 68,70];
let all_pass_average = every_num.every(ev_ry);

console.log(all_pass_average); // output...........false

// this function contains the every method operation algorithm
function ev_ry(value, index, array) {
  return value >= 49;
}



// some() example

// declare an array
const sm_num = [49.5,21, 34, 80,60 ,74 , 82, 53, 48, 96, 16, 68,70];
let sm_pass_average = sm_num.some(so_me);
 
console.log(sm_pass_average); // output...........true
 
// This function contains every method and operation in the algorithm.
function so_me(value, index, array) {
  return value >= 49;
}

JavaScript Array reduce()

The reduce() method operates from left to right in the array, applying a function to each element to reduce it to a single value.

For Example

const redu_num = [49.5,21, 34, 80,60 ,74 , 82, 53, 48, 96, 16, 68,70];
let sum_num = redu_num.reduce(reduce_Function);

console.log(sum_num); // output...........true

function reduce_Function(total, value, index, array) {
  return total + value;
}

Conclusion

In this article, you learned about JavaScript array iteration and the different methods you can use to loop through an array for different operations.

Categorized in:

JavaScript