EDITORIAL NOTE: In this post, we feature a comprehensive JavaScript String Contains Example. We will see some methods that can determine whether a string contains the characters of a specified string.
Usually, programming languages have a special pre-processed function to find a sub-string of a string. But what happens when you language of choice doesn’t have one? Well the answer to that is: You make one! How exactly do you write such function in JavaScript, we are going to show you below.
Does a ready made function exist?
It does!
If you want to find if a string contains another string then you already have a ready made function for that, and it would be string.includes(). This function returns true when the method finds another substring included in the main one, and returns false when the main string does not contain the substring.
You can use it like this:
var string='Find the substring in this string!';
console.log(string.includes('Find')); //true
console.log(string.includes('substring')); //true
console.log(string.includes('Web Code Geeks')); //false
You can even see it being used like this:
console.log(str.includes('Find', 1)); // false
You see that here we have used another argument to the function. This represents the position from which the function starts to search for the substring. You see that the position we specified in the previous example is 1, and 'Find' is the first word of the main string. This returns false because the first position holds the index 0, and it changes from the nearest position by one. Also note that this method is case sensitive, which means that if you want to search for 'Era', but write the code below, then you will get a false result.
"Era Balliu".includes("era"); //false
So why don’t we use this? Because this method is not compatible with most browsers. It is supported by Chrome v.41 and is not supported by any other browsers, except for Firefox v.19-36 that has fixed the bugs and renamed the function to string.contains().
And what do we use that is compatible to most browsers? There are two other indirect methods, which we will learn how to use, below.
indexOf()
This method returns the index where the substring is first found, and returns -1 if the substring is not found at all in the main one.
Have a look at the code below:
var string='Merry Christmas and Happy New Year!';
console.log(string.indexOf('Merry')); // returns 0
console.log(string.indexOf('Blute')); // returns -1
console.log(string.indexOf('Christmas', 0)); // returns 5
console.log(string.indexOf('christmas', 0)); // returns -1
Be careful to notice that if the method returns 0 or 1 it doesn’t equal the true or false results we saw in the includes() method. It only shows the position where the substring is found, and here we remind you once again that the positions start from 0 and onwards not from 1.
In the first use of the indexOf() method we see that exact same thing, it has returned 0 because the word 'Merry' is located in the first position in the main string, while the second one has returned -1 because the substring 'Blute' is not even included in the main string.
In the third one it returns 5, which is the position where 'Christmas' is found in the string. The other use shows us that the indexOf() method is case sensitive. Please note that using indexof() instead of indexOf will turn out incorrect results.
In the same way you can use the lastIndexOf() method. The difference between these two methods is that the second one starts checking for the substring starting from the last index, and not from the first, as indexOf() does.
For both methods you can add the optional argument that states the index from where to start searching for the substring.
search()
The search() method, similarly to the previous methods, returns the index of the substring if it is found and -1 if it is not found. You can use it like below:
var string='Web Code Geeks';
console.log(string.search('Web')); //returns 0
This method too is case sensitive, and it is compatible with most browsers, though for Firefox prior to Gecko v.8.0 it has a catch.
When you leave search() function without an argument, it will search for an empty string, while for Firefox prior to v.8.0 of Gecko it would search for 'undefined', though now this problem is fixed.
Download the source code
This was an example of string contains in JavaScript.
You can download the full source code of this example here: StringContains
