Ignoring Case Check if Array contains String - JavaScript

avatar

Borislav Hadzhiev

Sun Oct 03 20213 min read

Ignoring Case Check if Array contains String - Array.findIndex #

To do a case insensitive check if an array contains a string in JavaScript:

  1. Use the Array.findIndex method, passing it a function
  2. The function should convert the array element and the string to lowercase and check for equality
  3. If the check is successful, the element's index is returned
index.js
// Not supported in IE 6-11 const names = ['John', 'Bob', 'Adam']; const name = 'ADAM'; const index = names.findIndex(element => { return element.toLowerCase() === name.toLowerCase(); }); console.log(index); // ๐Ÿ‘‰๏ธ 2

The function we've passed to the Array.findIndex method is called with each element in the array, until the function returns a truthy value or iterates over all of the array's values.

By converting the array element and the string to lowercase, we are able to do a case insensitive check for equality.

Once the callback function returns a truthy value, the element's index is returned from findIndex.

In the code example, the function returned 2, because the 3rd element in the array matched the string.

If the function we passed to findIndex never returns a truthy value, then findIndex returns -1.

index.js
const names = ['John', 'Bob', 'Adam']; const name = 'Tim'; const minusOne = names.findIndex(element => { return element.toLowerCase() === name.toLowerCase(); }); console.log(minusOne); // ๐Ÿ‘‰๏ธ -1

Ignoring Case Check if Array contains String - Array.some #

To do a case insensitive check if an array contains a string in JavaScript:

  1. Use the Array.some method, passing it a function
  2. The function should convert the array element and the string to lowercase and check for equality
  3. If the check succeeds, true is returned

The difference with Array.findIndex is that the Array.some method returns true or false, instead of the index of the array element or -1.

index.js
// Supported in IE 9-11 const names = ['John', 'Bob', 'Adam']; const name = 'JOHN'; const includesValue = names.some(element => { return element.toLowerCase() === name.toLowerCase(); }); console.log(includesValue); // ๐Ÿ‘‰๏ธ true

The function we passed to the Array.some method is called with each element of the array until a truthy value is returned or the array's values are exhausted.

By converting both the array element and the string to lowercase, we are able to do a case insensitive equality check. An alternative would be to convert both strings to uppercase, which achieves the same result.
Note that IE 9-11 supports the Array.some method, whereas it doesn't support the Array.find and Array.findIndex methods.

Ignoring Case Check if Array contains String - Array.find #

  1. Call the Array.find method, passing it a function
  2. The function should convert the array element and the string to lowercase and check for equality
  3. if the check succeeds, the array element is returned
index.js
// Not supported in IE 6-11 const names = ['John', 'Bob', 'Adam']; const name = 'ADAM'; const result = names.find(element => { return element.toLowerCase() === name.toLowerCase(); }); console.log(result); // ๐Ÿ‘‰๏ธ 'Adam'

The function we pass to the Array.find method gets called with each element in the array until it returns a truthy value or the array's values are exhausted.

We do a case insensitive equality check by converting both the array element and the string we check for to lowercase.

If the callback function returns a truthy value, then that element is returned from the Array.find method.

If all invocations of the callback function return a falsy value, the Array.find method returns undefined.

In the code example, our case insensitive check for adam succeeded, therefore Array.find returned the array element.

Join my newsletter

I'll send you 1 email a week with links to all of the articles I've written that week

Buy Me A Coffee