How to Check If String Contains a Substring in JavaScript?

When working with JavaScript, determining whether a string contains a specific substring is a common task. Whether you need case-sensitive checks or prefer a flexible, case-insensitive approach, this guide has it covered. The following shows you different ways of finding a substring in a JavaScript string:

1. Using String.prototype.includes();
2. Using String.prototype.indexOf();
3. Additional Methods.

It's important to note the distinction between finding a substring and checking for a complete word within a string. When you search for a substring, such as "are", occurrences like "fare" or "dare" will also be considered as matches. This is a key point to keep in mind as it differs from explicitly checking for whole words within a string.

Using String.prototype.includes()

Case-Sensitive Match

The includes() method is a robust way to check for the presence of a substring in a string. It performs a case-sensitive search by default, as you can see in the following example:

// ES6+
const str = 'Hello World!';

console.log(str.includes('World')); // true
console.log(str.includes('world')); // false

The result is a boolean value indicating whether the match is found or not.

Case-Insensitive Match

To perform a case-insensitive search, you can convert both the original string and the substring to lowercase before using includes():

// ES6+
const str = 'Hello World!';

console.log(str.toLowerCase().includes('world')); // true

Start Search From Specific Position

You can initiate the search from a specific position in the string by specifying the optional second argument to the method, for example, like so:

// ES6+
const str = 'Hello World!';

console.log(str.includes('Hello', 1)); // false
console.log(str.includes('ello', 1)); // true

Using String.prototype.indexOf()

Case-Sensitive Match

The indexOf() method returns the index position of the first occurrence of the substring. It performs a case-sensitive search by default, as you can see in the following example:

const str = 'Hello World!';

console.log(str.indexOf('World')); // 6
console.log(str.indexOf('world')); // -1

The result is an integer value, where -1 indicates no match was found, and other numeric values correspond to the index of the matching string.

Case-Insensitive Match

To perform a case-insensitive search, you can convert both the original string and the substring to lowercase before using indexOf():

const str = 'Hello World!';

console.log(str.toLowerCase().indexOf('world')); // 6

Start Search From Specific Position

You can initiate the search from a specific position in the string by specifying the optional second argument to the method, for example, like so:

const str = 'Hello World!';

console.log(str.indexOf('Hello', 1)); // -1
console.log(str.indexOf('ello', 1)); // 1

Additional Methods

JavaScript offers a range of other methods that you can use to find whether a string contains a specific substring to cater to specific needs:

• RegExp.prototype.test(str) Method

  Checks the string against the provided regular expression and returns a boolean value. This is particularly useful when you want to check for the existence of a pattern in a case-sensitive manner. For example:

  const str = 'This is an example.';
  const regExp1 = /example/;
  const regExp2 = /Example/;
  
  console.log(regExp1.test(str)); // true
  console.log(regExp2.test(str)); // false
  

  For case-insensitive matches, you can pass the i modifier to the regular expression:

  const str = 'This is an example.';
  const regExp1 = /example/i;
  const regExp2 = /Example/i;
  
  console.log(regExp1.test(str)); // true
  console.log(regExp2.test(str)); // true
  

• String.prototype.search(regExp) Method

  Finds the index of the first case-sensitive match using a regular expression. It returns the position of the match or -1 if none is found. For example:

  const str = 'This is an Example of examples.';
  const regExp = /example/;
  console.log(str.search(regExp)); // 22
  

  For case-insensitive matches, you can pass the i modifier to the regular expression:

  const str = 'This is an Example of examples.';
  const regExp = /example/i;
  console.log(str.search(regExp)); // 11
  

• String.prototype.lastIndexOf(searchValue) Method

  Returns the index position of the last case-sensitive occurrence of a value within a string. It's useful when you want to find the position of the last occurrence of a specific substring. For example:

  const str = 'This is an Example of examples.';
  const searchValue = 'example';
  console.log(str.lastIndexOf(searchValue)); // 22
  

  For case-insensitive matches, you can pass convert the string to lowercase prior to calling the method.

• String.prototype.match(regExp) Method

  Performs case-sensitive search for a value using a regular expression and returns an array of matches. It's useful when you want to extract substrings based on a pattern. For example:

  const str = 'This is an Example of examples.';
  const regExp = /example/g;
  console.log(str.match(regExp)); // ['example']
  

  For case-insensitive matches, you can pass the i modifier to the regular expression:

  const str = 'This is an Example of examples.';
  const regExp = /example/ig;
  console.log(str.match(regExp)); // ['Example', 'example']
  

• String.prototype.startsWith(searchValue) Method

  Returns true or false if a string starts with the specified, case-sensitive, value. It's useful when you need to check the beginning of a string for a specific substring. For example:

  const str = 'JavaScript';
  const searchValue = 'Java';
  console.log(str.startsWith(searchValue)); // true
  

  For case-insensitive matches, you can pass convert the string to lowercase prior to calling the method.

• String.prototype.endsWith(searchValue) Method

  Returns true or false if a string ends with the specified, case-sensitive, value. It's useful when you need to check the end of a string for a specific substring. For example:

  const str = 'JavaScript';
  const searchValue = 'Script';
  console.log(str.endsWith(searchValue)); // true
  

  For case-insensitive matches, you can pass convert the string to lowercase prior to calling the method.

With these additional methods, you can choose the one that fits your specific needs.