Check if a String Contains a Substring in JavaScript

JavaScript is an incredibly versatile language, and working with strings is one of its many strengths. Whether you're building a web application, processing data, or just playing around with code, you may need to check if a string contains a specific substring. JavaScript provides several ways to do this, each with its own quirks and advantages. Let's dive in and explore these methods in detail.

Method 1: includes()

The includes() method is one of the simplest and most straightforward ways to check if a string contains a substring. It was introduced in ECMAScript 6 (ES6), so it's modern and widely supported in all current browsers.

Syntax

string.includes(substring, start)

• substring: The string to search for.
• start (optional): The position in the string at which to start the search. The default is 0.

Example

const str = "JavaScript is awesome!";
const substr = "awesome";

if (str.includes(substr)) {
	console.log('Yes, the string contains "${substr}"');
} else {
	console.log('No, the string does not contain "${substr}"');
}

Output

Yes, the string contains "awesome"

Method 2: indexOf()

Before includes() was introduced, indexOf() was the go-to method, returning the index of the first occurrence of the specified substring. If the substring is not found, it returns -1.

Syntax

string.indexOf(substring, start)

• substring: The string to search for.
• start (optional): The position in the string at which to start the search. The default is 0.

Example

const str = "JavaScript is awesome!";
const substr = "awesome";

if (str.indexOf(substr) !== -1) {
	console.log('Yes, the string contains "${substr}"');
} else {
	console.log('No, the string does not contain "${substr}"');
}

Output

Yes, the string contains "awesome"

Method 3: match()

You can also use the match() method, which returns an array of matches or null if no matches are found.

Syntax

string.match(regex)

• string: The string to search within.
• regex: A regular expression pattern.

Example

const str = "JavaScript is awesome!";
const regex = /awesome/;

const matches = str.match(regex);

if (matches) {
	console.log('Yes, the string contains "awesome"');
} else {
	console.log('No, the string does not contain "awesome"');
}

Output

Yes, the string contains "awesome"

Method 4: search()

The search() method is another way to use regular expressions to find a substring. It returns the index of the first match or -1 if not found.

Syntax

string.search(regex)

• regex: A regular expression pattern.

Example

const str = "JavaScript is awesome!";
const regex = /awesome/;

if (str.search(regex) !== -1) {
	console.log('Yes, the string contains "awesome"');
} else {
	console.log('No, the string does not contain "awesome"');
}

Output

Yes, the string contains "awesome"

Method 5: slice() and Manual Search

If you're feeling adventurous, you can manually search for a substring using a combination of slice() and a loop. This method isn't the most efficient, but it can be a fun exercise!

Syntax

string.slice(start, end)

• start: The index of the first character to include in the returned substring.
• end: The index of the first character to exclude from the returned substring.

Example

const str = "JavaScript is awesome!";
const substr = "awesome";
let found = false;

for (let i = 0; i <= str.length - substr.length; i++) {
	if (str.slice(i, i + substr.length) === substr) {
		found = true;
		break;
	}
}

if (found) {
	console.log('Yes, the string contains "${substr}"');
} else {
	console.log('No, the string does not contain "${substr}"');
}

Output

Yes, the string contains "awesome"

Method 6: Regular Expressions

Regular expressions (regex) can be extremely powerful for more advanced searches. They allow for complex pattern matching and searching within strings.

Syntax

regex.test(string)

• regex: A regular expression pattern.
• string: The string to search within.

Example

const str = "JavaScript is awesome!";
const regex = /awesome/;

if (regex.test(str)) {
	console.log('Yes, the string contains "awesome"');
} else {
	console.log('No, the string does not contain "awesome"');
}

Output

Yes, the string contains "awesome"

Conclusion

And there you have it! Five ways to check if a string contains a substring in JavaScript. Whether you prefer the simplicity of includes(), the versatility of regular expressions, or the classic approach of indexOf(), you have plenty of tools at your disposal.