Categories
JavaScript Tutorials

Iterative Methods

Javascript defines a bunch of iterative methods for arrays.

Each of the methods accept one argument : a function to run on each item.

The function passed into one of these methods will receive three arguments: 

  1. the array item value, 
  2. the position of the item in the array, 
  3. and the array object itself. 

Depending on the method, the results of this function’s execution may or may not affect the method’s return value. Some of the iterative methods are as follows:

  • every() — Runs the given function on every item in the array and returns true if the function returns true for every item.
  • filter() — Runs the given function on every item in the array and returns an array of all items for which the function returns true.
  • forEach() — Runs the given function on every item in the array. This method has no return value.
  • map() — Runs the given function on every item in the array and returns the result of each function call in an array.
  • some() — Runs the given function on every item in the array and returns true if the function returns true for any one item.

These methods do not change the values contained in the array.

Of these methods, the two most similar are every() and some(), which both query the array for items matching some criteria. For every(), the passed-in function must return true for every item in order for the method to return true; otherwise, it returns false. The some() method, on the other hand, returns true if even one of the items causes the passed-in function to return true. Here is an example:

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item, index, array){
  return (item > 2);
});
alert(everyResult); //false
var someResult = numbers.some(function(item, index, array){
  return (item > 2);
});
alert(someResult); //true

This code calls both every() and some() with a function that returns true if the given item is greater than 2. For every(), the result is false, because only some of the items fit the criteria. For some(), the result is true, because at least one of the items is greater than 2.

The next method is filter(), which uses the given function to determine if an item should be included in the array that it returns. For example, to return an array of all numbers greater than 2, the following code can be used:

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
  return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]

Here, an array containing the values 3, 4, 5, 4, and 3 is created and returned by the call to filter(), because the passed-in function returns true for each of those items. This method is very helpful when querying an array for all items matching some criteria.

The map() method also returns an array. Each item in the array is the result of running the passed in function on the original array item in the same location. For example, you can multiply every number in an array by two and are returned an array of those numbers, as shown here:

var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
  return item * 2;
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]

The code in this example returns an array containing the result of multiplying each number by two. This method is helpful when creating arrays whose items correspond to one another. The last method is forEach(), which simply runs the given function on every item in an array. There is no return value and is essentially the same as iterating over an array using a for loop. Here’s an example:

var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
  //do something here
});

All of these array methods ease the processing of arrays by performing a number of different operations.

Examples

Create an array of elements and print all the elements in console.

var numbers = [1,2,3,4,5];
numbers.forEach(function(num){
  console.log(num);
});

Create an array of numbers. Add 10 to each number and print them in an array.

var numbers = [1,2,3,4,5];
var newNumbers = numbers.map(function(num){
  return num + 10;
});
console.log(newNumbers);

Create an array of numbers. Find their squares and print them in an array.

var numbers = [1,2,3,4,5];
var newNumbers = numbers.map(function(num){
  return num ** 2;
});
console.log(newNumbers);

Create an array of numbers. Find only the even numbers and print them in an array.

var numbers = [1,2,3,4,5];
var newNumbers = numbers.filter(function(num){
  return num%2 === 0;
});
console.log(newNumbers);

Create an array of numbers. Find only the numbers that are multiples of 3 and print them in an array.

var numbers = [21,2,3,4,9];
var newNumbers = numbers.filter(function(num){
  return num%3 === 0;
});
console.log(newNumbers);

Create an array of numbers. Check whether all the numbers are even or not.

var numbers = [21,2,3,4,92];
var newNumbers = numbers.every(function(num){
  return num%2 === 0;
});
console.log(newNumbers);

Create an array of numbers. Check whether any one of them is a prime number.

var numbers = [21,2,37,4,92];
var newNumbers = numbers.some(function(num){
  var count = 0;
  for(var i=1;i<=num;i++) {
    if(num%i===0) {
      count++;
    }
  }
  return count === 2;
});
console.log(newNumbers);