6 ways to check if a string contains a substring in JavaScript

Checking if a string contains another string is a very common task. JavaScript provides many ways to check if a string contains a substring.

In this tutorial, we will look into 6 different ways to find out whether a substring is a part of a string or not. Let's start with the most common one: indexOf() method.

1. string.indexOf()

The most common (and perhaps the fastest) way to check if a string contains a substring is to use indexOf() method. This method returns the position of the first occurrence of the substring. If no substring is found, it returns -1.

The indexOf() method is case sensitive and accepts two parameters. The first parameter is the substring to search for and the second optional parameter is the position to start the search (default to 0).

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
str.indexOf('MongoDB') !== -1 // true
str.indexOf('Java') !== -1 //false
str.indexOf('Node', 5) !== -1 //true

2. string.includes()

The includes() method was introduced in ES6 and works in all modern browsers except Internet Explorer. Unlike the good old indexOf() method, which returns the starting index of the substring, includes() method returns true if the string contains the specified characters, and false if not.

Similar to indexOf() method, includes() is also case sensitive and accepts an optional second parameter, an integer which indicates the position where to start searching for.

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
str.includes('MongoDB') //true
str.includes('Java') //false
str.includes('Node', 5) //true

3. string.search()

The search() method searches the position of the substring in a string, and returns the position of the match. The search value can be string or a regular expression. It returns -1 if no match is found.

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
str.search('MongoDB')  !== -1 //true
str.search('Java') !== -1 //false
str.search(/node/i) !== -1 //true where i is the case insensitive modifier 

4. string.match()

Another way to check if a string contains a substring is to use the match() method. It accepts a regular expression as parameter and searches the string for a match. If it finds the matches, it returns an object, and null if no match is found.

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
str.match(/MongoDB/)
//["MongoDB", index: 18, input: "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js", groups: undefined]
str.match(/Java/) //null
str.match(/MongoDB/g)  !== null //true
str.match(/Java/g) !== null //false
str.match(/node/i) !== null //true where i is the case insensitive modifier 

The match() method will return only the first match in the string, if the regular expression does not include the g modifier.

5. RegExp.test()

The regular expression test() method checks if a match exists in a string. This method returns true if it finds a match, otherwise it returns false.

We first need to create a regular expression for the substring and then test it against the target string.

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
var exp = /MongoDB/g;
exp.test(str) //true
/Java/g.test(str) //false
/node/i.test(str) //true where i is the case insensitive modifier 

For more details on how to create and use regular expressions, check out Introduction to JavaScript Regular Expressions.

6. Lodash

Lodash is a third-party library which provides _.includes() method to check whether a string contains another string or not. This method returns true if a match is found, otherwise false.

var str = "The MEAN stack is MongoDB, Express.js, AngularJS, and Node.js";
_.includes(str, 'MongoDB') //true
_.includes(str, 'Java') //false
_.includes(str, 'Node') //true 

Summary

As we have seen, there are many ways to check if a string contains a substring in JavaScript. So what is the best way?

• includes() is the easiest way to check but is limited to modern browsers. Although, you can add Polyfill support to use it in IE and other older browsers, but it means loading of external JavaScript files.
• Regular expressions are slow and will add unnecessary performance overhead just to perform a simple task. So they are not advisable.
• Lodash is another good option but again requires to load external JavaScript file.
• If you care about speed, simply use indexOf() method. It works faster and everywhere.

If you have any question or feedback, please feel free to send me a tweet anytime.

Happy Coding 😍

Like this article? Follow @attacomsian on Twitter. You can also follow me on LinkedIn and DEV.