Make includes() case insensitive in JavaScript

avatar

Borislav Hadzhiev

Last updated: Jul 25, 2022

banner

Photo from Unsplash

Make includes() case insensitive in JavaScript #

To make the String.includes() method case insensitive, convert both of the strings in the comparison to lowercase, e.g. str.toLowerCase().includes(substr.toLowerCase()). A case insensitive comparison is done by converting the two strings to the same case.

index.js
const str = 'HELLO WORLD'; const substr = 'hELLo'; // 👇️ true console.log(str.toLowerCase().includes(substr.toLowerCase())); if (str.toLowerCase().includes(substr.toLowerCase())) { // 👉️ the substring is included in the string }

We converted both strings to lowercase to make a case insensitive lookup using the String.includes method.

We could achieve the same result by converting the strings to uppercase. We just need the strings to be the same case to be able to determine if the substring is contained in the string.

To perform a case insensitive check whether a string is contained in an array:

  1. Use the Array.some() method to iterate over the array.
  2. On each iteration, lowercase the current array element and the string it should be compared to.
  3. The Array.some method will return true if the condition is met at least once.
index.js
const arr = ['HELLO', 'WORLD']; const str = 'HeLLo'; const isContained = arr.some(element => { return element.toLowerCase() === str.toLowerCase(); }); console.log(isContained); // 👉️ true

The function we passed to the Array.some method gets invoked with each element in the array until it returns a truthy value or iterates over all elements.

To perform a case insensitive check whether the string is contained in the array, we convert both the array element and the string to lowercase.

The Array.some method returns true if the callback function returns a truthy value at least once.

If all of the invocations of the function we passed to Array.some return a falsy value, the method returns false.

The Array.some method stops iterating once its callback returns a truthy value.

To perform a case insensitive check whether a string is contained in an array and get the first match:

  1. Use the Array.find() method to iterate over the array.
  2. On each iteration lowercase the array element and the string it should be compared to.
  3. The Array.find method returns the first array element that satisfies the condition.
index.js
const arr = ['HELLO', 'WORLD']; const str = 'HeLLo'; const found = arr.find(element => { return element.toLowerCase() === str.toLowerCase(); }); console.log(found); // 👉️ HELLO if (found !== undefined) { // 👉️ string is in array }

The function we passed to the Array.find method gets invoked with each element in the array until it returns a truthy value or iterates over the entire array.

The Array.find() method returns the first element that satisfies the condition. If you need to get all matching elements, use the Array.filter()method.

If you need to perform a case insensitive check whether a string is contained in an array and get all matches:

  1. Use the Array.filter() method to iterate over the array.
  2. On each iteration, lowercase the array element and the string it should be compared to.
  3. The Array.filter method will return an array of all of the elements that satisfy the condition
index.js
const arr = ['HELLO', 'HeLlO', 'WORLD']; const str = 'HeLLo'; const matches = arr.filter(element => { return element.toLowerCase() === str.toLowerCase(); }); console.log(matches); // 👉️ ['HELLO', 'HeLlO'] if (matches.length > 0) { // 👉️ at least 1 match found in array }

The function we passed to the Array.filter method gets called with each element of the array.

The Array.filter method does not stop iterating once the callback function returns a truthy value. It returns an array of all elements that satisfy the condition.

Further Reading #

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.