How to Search Arrays in JavaScript

On this page we demonstrate and describe how to use JavaScript to search the elements in an array to see if they match a particular value or fulfill specified criteria. Historically, JavaScript has not included a very impressive selection of array methods. When performing a search, a for loop would be used to iterate through the elements and check them individually.

However, recent versions of JavaScript have added new search methods. The new array methods indexOf and lastIndexOf were added in ECMAScript 5, and the find and findIndex methods were added in ECMAScript 6.

The indexOf and lastIndexOf methods are well supported in browsers in current use (not Internet Explorer 8). The ECMAScript 6 methods are not supported by Internet Explorer 11.[1] In any case, whether for the purposes of browser support or general JavaScript knowledge, it is important to know how to perform searches using for loops.

Searching Arrays Using for Loops

The function defined below accepts two arguments: an array and a value. It uses a for loop to inspect each element of the array in turn to see if it matches the value passed to the function. It will return the index number of the matching value or -1 if there is no match.

// function to search array using for loop
function findInArray(ar, val) {
    for (var i = 0,len = ar.length; i < len; i++) {
        if ( ar[i] === val ) { // strict equality test
            return i;
        }
    }
    return -1;
}

// example array
var ar = ['Rudi', 'Morie', 'Halo', 'Miki', 'Mittens', 'Pumpkin'];
// test the function 
alert( findInArray(ar, 'Rudi') ); // 0 (found at first element)
alert( findInArray(ar, 'Coco') ); // -1 (not found)

The function above uses the identity operator (===) to perform a strict equality check. It could be modified to test for equality (==) rather than identity.[2] The indexOf and lastIndexOf methods, discussed next, use a strict equality check in their searches whereas a custom search function using a for loop can opt to accommodate type conversion.

JavaScript's indexOf Method for Arrays

The indexOf method searches an array for a value you specify. It returns the index location of the found element or -1 if no match is found. We demonstrate its basic use here:

var ar = ['Rudi', 'Morie', 'Halo', 'Miki', 'Mittens', 'Pumpkin'];
// display indexOf return value
console.log( ar.indexOf('Mittens') ); // 4 ('Mittens' is 5th element)
console.log( ar.indexOf('Coco') ); // -1 ('Coco' not in array)

The following demonstrates the use of the indexOf method's return value in a code branch:

// test indexOf return value
if ( ar.indexOf('Mittens') === -1 ) {
    alert('Kitten name available');
} else {
    alert('Kitten name taken');
}

The indexOf method includes an optional second argument that specifies the index location from which to start the search. The start value can range from 0 (the default) to array length - 1.[3] Here we demonstrate using the indexOf method with a start value specified:

var ar = ['Rudi', 'Morie', 'Halo', 'Miki', 'Mittens', 'Pumpkin'];
// specifying start value for indexOf
console.log( ar.indexOf('Miki', 2) ); // 3 ('Miki' is 4th element)
console.log( ar.indexOf('Morie', 2) ); // -1 (not found)

Notice in the above example when starting our search for 'Morie' from index location 2, -1 is returned. It is not found since it is at index location 1.

JavaScript's lastIndexOf Method for Arrays

While indexOf searches forward through the array, the lastIndexOf method searches backwards through the array starting by default from the last element. It returns the index number of the last occurring instance of the value searched for:

var ar = [1, 2, 3, 2, 1];
// location of last 2 in ar
console.log( ar.lastIndexOf(2) ); // 3 (4th element)

The lastIndexOf method also supports a second argument specifying the starting location of the search. If the second argument is positive, the search commences from that index location backwards through the array.

var ar = [1, 2, 3, 2, 1];
// location of last 2 searching backwards from index location 3
console.log( ar.lastIndexOf(2, 3) ); // 3 (4th element)
// location of last 2 searching backwards from index location 2
console.log( ar.lastIndexOf(2, 2) ); // 1 (2nd element)

If the second argument is negative, it counts the number of elements from the end of the array to begin the search backwards through the array. (-1 specifies the last element.)

var ar = [1, 2, 3, 2, 1];
// location of last 2 searching backwards from 3rd element from end of ar
console.log( ar.lastIndexOf(2, -3) ); // 1 (2nd element)
// location of last 2 searching backwards from 2nd element from end of ar
console.log( ar.lastIndexOf(2, -2) ); // 3 (4th element)

JavaScript's find and findIndex Methods for Arrays

The indexOf and lastIndexOf methods, described and demonstrated above, ascertain whether a particular value exists in an array. In contrast, the find and findIndex methods use a function that you provide to test values in an array according to criteria you specify. The find method returns the first value matching your criteria, or undefined if no match is found. The findIndex method returns the index location of the first value matching your criteria, or -1 if no match is found.

Like the ECMAScript 5 iteration methods, when you invoke these methods on an array, you pass a function as the first argument. Each element of the array is passed in turn to this function which accepts three arguments: the current element, its index, and the array itself.

Examples below demonstrate the find and findIndex methods. The first searches an array for negative numbers:

// example function for find and findIndex methods
function findNegNum(el, i, ar) {
    return el < 0;
}

// array to test
var ar = [1, 20, false, -2];

// find method returns first negative number found
console.log( ar.find(findNegNum) ); // -2
// findIndex method returns index of first negative number located
console.log( ar.findIndex(findNegNum) ); // 3 (4th element)

We use the same function to demonstrate both the find and findIndex methods in these examples. The only difference: the find method returns the value of the matching element while findIndex returns its index location.

The following example searches an array for non-numeric values:

// example function to find non-numeric array values
function findNonNum(el, i, ar) {
    return typeof el !== 'number';
}

// example array with some non-numeric values
var ar = [2, 27, 33.45, true, 'yes', 0, 3.14];

// find method returns value of first non-numeric element
console.log( ar.find(findNonNum) ); // true

// findIndex returns location of first non-numeric element
console.log( ar.findIndex(findNonNum) ); // 3 (4th element)


// another example array to search for non-numeric values
var ar2 = [1, 2, 3, 4.4];

// find method returns undefined when no match is found
console.log( ar2.find(findNonNum) ); // undefined

// findIndex method returns -1 when no match is found
console.log( ar2.findIndex(findNonNum) ); // -1

Back to top


  1. MDN (Mozilla Developer Network) reference pages provide details on browser compatibility; see entry on Array.prototype.find. ^
  2. The equality operator performs type-conversion as necessary for comparing values whereas the identity operator returns false if two values are not of the same type. ^
  3. If the start value is negative the entire array is searched. If the start value is greater than the array length, the array is not searched and -1 is returned. ^