How to check if a string contains a substring using indexOf() in JavaScript

published: 07 Jul 2022

2 min read

Check if a string contains a substring using indexOf() in JavaScript

To check if a string contains a substring in JavaScript:

  1. Call the String.indexOf() method on the given string, passing it to the substring as a parameter.
  2. Compare the returned value to -1.
  3. If the returned value is not equal to -1, the string contains the substring.
const str = 'React is a popular JavaScript library.'
const substr = 'JavaScript'

const index = str.indexOf(substr)
console.log(index) // 19

if (str.indexOf(substr) !== -1) {
  console.log('String contains '${substr}'')
} else {
  console.log('String does not contain '${substr}'')
}
// String contains 'JavaScript'

The String.indexOf(searchValue[, fromIndex]) method takes two parameters:

  1. searchValue - A string representing the value to search for within this string. If no string is explicitly specified, searchValue will default to undefined and this value will be searched in the current string.
  2. fromIndex - An optional integer that represents the index to start the search from. The default value is 0.

The String.indexOf() method returns the index of the first occurrence of searchValue in the string, or -1 if not found. If an empty string is passed as searchValue, it will match at any index between 0 and str.length.

Note: In JavaScript, the first character in a string has an index of 0, and the index of the last character is str.length - 1.

Let us have another example:

const str = 'React is a popular JavaScript library.'

str.indexOf('React') // 0
str.indexOf('Preact') // -1
str.indexOf('React', 5) // -1
str.indexOf('') // 0
str.indexOf('', 5) // 5

The String.indexOf() method is case-sensitive, which means the following expressions evaluate to -1:

'JavaScript'.indexOf('script')    // -1
'JavaScript'.indexOf('SCRIPT')    // -1

If more than one matched substrings are present, String.indexOf() will return the first position of the first occurrence:

'Java, Java, Java!'.indexOf('Java')   // 0

The value 0, returned by the String.indexOf(), method does not evaluate to true. The same is the case with -1, which does not evaluate to false either.

So if you leave the equal operator to explicitly verify the presence of the string, you might see incorrect results.

Here is an interesting example:

const str = 'Apple is the manufacturer of iPhone X.'

if(str.indexOf('Apple')) {
    console.log('Awesome!')
}

if(str.indexOf('Samsung')) {
    console.log('Good!')
}

In the above code, the first if condition will never execute even though the word Apple does exist in the string. Similarly, the second if condition will evaluate to true although the string does not contain the word Samsung.

For this reason, when checking if a string contains another substring, the correct way to check would be:

if (str.indexOf('Apple') !== -1) {
    console.log('Awesome!')
}

if (str.indexOf('Samsung') !== -1) {
    console.log('Good!')
}

Read this article to learn about other JavaScript functions that can be used to check the presence of a substring in a string.

How to check if a string contains a substring using indexOf() in JavaScript | Coding Tips And Tricks

Are we missing something?  Help us improve this article. Reach out to us.

Are you looking for other code tips?

Check out what's on in the category: react, javascript, preact, programming
Check out what's on in the tag: react, javascript, preact, programming