Most useful JavaScript Array Functions – Part 1

In this article, we are going to discuss the following two JavaScript array functions. Both of these functions are widely used in industry and make the JavaScript code clean, modularized, and easy to understand.

• Array.prototype.every()
• Array.prototype.some()

Array.prototype.every(): This function is used when you need to validate each element of a given array. It accepts a callback function as an argument which is called for each element of the array. The callback function has to return either true or false. If all elements of the array satisfy the validation function and thus the callback function returns true on all elements of the array, then it returns true. Otherwise, it returns false, as soon as it encounters the first element which does not satisfy the validator function. 

Syntax:

arr.every(callback(element[, index[, array]])[, thisArg])

Parameters: This function accepts five parameters as mentioned above and described below:

• callback: This parameter holds the function to be called for each element of the array.
• currentValue: The parameter holds the value of the elements being processed currently.
• index: This parameter is optional, it holds the index of the currentValue element in the array starting from 0.
• array: This parameter is optional, it holds the complete array on which Array.every is called.
• thisArg: This parameter is optional, it holds the context to be passed as this is to be used while executing the callback function. If the context is passed, it will be used as this for each invocation of the callback function, otherwise undefined is used as default.

Given an array, write a function to check if all elements of that array are less than 100 or not.

Example 1: In this code, we will check the array by using a loop function. So the naive approach is to use for loop as shown below. Although the below implementation is easy to understand for any novice programmer, there are some unnecessary checks which the programmer has to take care of. For example, the short-circuiting mechanism i.e. the programmer has to explicitly make sure that as soon as the loop encounters the first element which fails the given condition, the loop should break and return false. Also until and unless the programmer dives deep into the logic of the code, he/she won’t be able to understand what this for loop is doing. 

let numbers = [30, 60, 190];
let result = true;
for (let i = 0; i < numbers.length; i++) {
    if (numbers[i] >= 100) {
        result = false;
        break;
    }
}
console.log(result);

Output:

false

Example 2: In this code, we will check the array by using an Array.prototype.every() function. So the naive approach is to use for a loop as shown below. with the use of Array.every(), the same behavior can be achieved with much clearer, more intuitive and less code. 

let numbers = [30, 60, 90];
let result = numbers.every(function (element) {
    return (element < 100);
});

console.log(result);

Output:

true

Given an array, write a function to check if all elements of that array are of a specified data type.

Example 1: Again naive approach would be to iterate over the array using for loop. This code snippet has the same loopholes as the previous example. 

function fnCheckDatatype_Every(arr, sDatatype) {
    for (let i = 0; i < arr.length; i++) {
        if (typeof (arr[i]) != sDatatype) {
            return false;
        }
    }
    return true
};

console.log(fnCheckDatatype_Every(["Geeks", 4, "Geeks"], "string"));
console.log(fnCheckDatatype_Every(["Geeks", "for", "Geeks"], "string"));

Output:

false
true

Example 2: Using arr.Every() of those loopholes is taken care of again in the code snippet below. Another point to note in the code snippet below is that we are passing two arguments to the array.every() function. The first one is the callback function (anonymous function in our case) and the second one is sDatatype. Because we need an external variable in each call of a callback function, we pass it as a second argument as ‘this’ variable. 

function fnCheckDatatype_Every(arr, sDatatype) {
    return arr.every(function (element) {
        return typeof (element) === sDatatype;
    }, sDatatype);
}

console.log(fnCheckDatatype_Every(["Geeks", "for", "Geeks"], "string"));
console.log(fnCheckDatatype_Every(["Geeks", 4, "Geeks"], "string"));

Output:

true
false

Array.prototype.some(): This is in a way opposite to Array.every(). This function is used when you need to check if at least one element of a given array passes the test implemented by the callback function. Array.some() accepts a callback function as an argument which has to return either a true or false. The callback function is called for each element of the array until it returns true for at least one element of the array. If neither of the elements in the array passes the test of the callback function, it returns false. 

Syntax:

arr.some(callback(element[, index[, array]])[, thisArg])

Parameters: This function accepts four parameters as mentioned above and described below:

• callback: This parameter holds the function to be called for each element of the array.
• currentValue: The parameter holds the value of the elements being processed currently.
• index: This parameter is optional, it holds the index of the currentValue element in the array starting from 0.
• array: This parameter is optional, it holds the complete array on which Array.every is called.
• thisArg This parameter is optional, it holds the context to be passed as this is to be used while executing the callback function. If the context is passed, it will be used as this for each invocation of the callback function, otherwise undefined is used as default.

Given an array, write a function to check if an array contains any number greater than 100.

Example 1: Naive Approach 

function fnIsGreaterThan100_loop(arr) {
    for (let i = 0; i < arr.length; i++) {
        if (arr[i] > 100) {
            return true;
        }
    }
    return false;
}

console.log(fnIsGreaterThan100_loop([30, 60, 90, 120]));
console.log(fnIsGreaterThan100_loop([30, 60, 90]));

Output:

true
false

Example 2: Using Array.some() 

function fnIsGreaterThan100_some(arr) {
    return arr.some(function (element) {
        return (element > 100);
    });
}

console.log(fnIsGreaterThan100_some([30, 60, 90, 120]));
console.log(fnIsGreaterThan100_some([30, 60, 90]));

Output:

true
false

Given an array, write a function to check if an array contains an even number.

Example 1: Naive approach 

function fnIsEven_loop(arr) {
    for (let i = 0; i < arr.length; i++) {
        if (arr[i] % 2 === 0) {
            return true;
        }
    }
    return false;
}

console.log(fnIsEven_loop([1, 3, 5]));
console.log(fnIsEven_loop([1, 3, 5, 6]));

Output:

 false
 true

Example 2: Using Array.some() 

function fnIsEven_some(arr) {
    return arr.some(function (element) {
        return (element % 2 === 0);
    });
}

console.log(fnIsEven_some([1, 3, 5]));
console.log(fnIsEven_some([1, 3, 5, 6]));

Output:

 false
 true

One of the common mistakes programmers do while using array functions like Array.every() and Array.some() is that they forget the return the value in the callback function. Mind it, if you don’t return any value from the callback function, null is returned which will be interpreted as false. Also, it is important to know that these array functions were introduced in ECMAScript 5. So these functions are supported in IE9 or higher. If you need to use it for older browsers as well, then a library like underscore.js can come to your rescue which has an equivalent implementation of such functions. Must use JavaScript Array Functions -Part 2 Must use JavaScript Array Functions -Part 3 

This article is contributed by Harshit Jain