3 Ways to Check if a String in JavaScript Contains a Substring

This article will teach you how to check whether a string in JavaScript contains a specific substring. This task is very common in the world of programming. The reason for why we’ll see three different methods to achieve it.

Here we go…

Using the JavaScript includes() method

You can use the JavaScript includes() method, introduced in ES6, if you want to check if a JavaScript string contains a character or a substring.

So, the includes() method in JavaScript performs a case-sensitive search on a string to determine if it includes the given substring.

Let’s have a look at the following example,

const str = 'iizituts is awesome!';
console.log(str.includes('iizituts')); //true
console.log(str.includes('iiZiTuts')); //false

The output for line 2 is “true” since the string str contains the substring iizituts. However, although we’re looking for the same substring in line 3, the output is “false“. This is due to the reason that the includes() method is case-sensitive.

You could also specify a second argument to the includes() method as the index in the string from which we should start the search. Let’s see the following example…

const str1 = 'Hey! Can you find me?';
console.log(str1.includes('!', 4)); // false

In the example above, the output at line 2 is “false” and that’s because we’re starting the check from the character at index 4 where the substring ‘!‘ is situated before it.

Notice that the second argument defaults to 0. That means that the first character in a string is found at index 0, the second at index 1, and so on…

Using the JavaScript indexOf() method

The other alternative you can use to look up a substring in a given string using JavaScript is the indexOf() method.

Instead of returning true or false, the indexOf() returns the index of the first occurrence of the specified substring found within the given string. If nothing was found, then it returns -1.

Let’s have a look at the following example,

const str = 'Fact: iizituts is awesome!';
console.log(str.indexOf('iizituts')); //6
console.log(str.indexOf('iizituts') !== -1); //true
console.log(str.indexOf('iiZiTuts') !== -1); //false

In line 2, we get “6” since the first occurrence of “iizituts” is found at index 6. Notice that the index at the first position in the given string is 0.

Now, in line 3, we are checking if the string str contains the substring “iizituts“. And according to line 1, applying the indexOf() method returns 6 which is different from -1. Therefore, “true” is printed on the console. This means that the substring “iizituts” is found within the string str.

Line 4 proves that indexOf() method is case-sensitive. Even though “iiZiTuts” and “iizituts” appear to be the same word, we get “false“.

In the same way, as in the includes() method, a second argument can be specified to the indexOf() method. It tells it from where to start off the search.

const str1 = 'Fact: iizituts is awesome!';
console.log(str1.indexOf('iizituts', 7) !== -1); //false

In line 2, we specified 7 as a second argument from which the method should start the check. And since the first occurrence of “iizituts” is found at index 6 (See the previous example), the result is going to be “false“.

Using the Regex test() method

You can make use of the test() method of Regex (Regular expressions) to check if a string in JavaScript contains a substring.

The test() method takes a string as an argument and returns “true” if a match is found between the regular expression and the specified string. Otherwise, it returns “false“.

Here’s an example,

const str = 'Fact: iizituts is awesome!';
const result = /iizituts/.test(str); 
console.log(result);// true

In line 2, we are testing the /iizituts/ regular expression on the string str. Then, in line 3, we get “true” because the test() method has found one match between the regex and the string str.

You might use the test() method of regular expressions if you want to make a more dynamic complex and custom search. However, for simpler checks as in the example above, using the includes() or indexOf() methods would be quicker and better.

That’s it! If you have any questions or feedback, please, use the comment section below.

Enjoy 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *