JavaScript has methods and functions that allow users to check whether their string contains another string or substring.
Often working with JavaScript projects, users need to check their JS string to evaluate whether a word has any typical character or a typical set of characters.
There are quicker approaches in JavaScript to check this efficiently, where users can use the include(), indexOf(), array.some() methods, and for loop to test a string containing a substring.
Method 1: Using the include() method to check substrings
One of the most standard ways to check whether a string contains a substring is to use the include() method, introduced with ES6. Users will call this method on a particular word or character to search through.
Syntax:
string.includes(substring, index);
Parameter used:
The above method accepts two parameters, and these are as follows:
- Substring: This parameter represents a character or the series of characters users search for to check if this exists inside the parent string. This parameter is required.
- Index: This parameter specifies the index from which the above parameter will start the search for the substring. It returns a default value "zero" since indexing in programming languages begins at the 0th position. It is an optional parameter.
The method will return a Boolean value, either true or false, based on the condition required.
Code Snippet:
let a= "This is an example of JavaScript";
let b = "Script";
console.log(a.includes(b));
Output:
Explanation:
Look at the program and output to see how the include() method worked. Here, we have passed a string input in the variable "a" and checked the substring within variable "b." It returned true since the string contains "Script" in the output console.
But one thing users must remember is that this method is case-sensitive and so the following code snippet will return false:
let a= "This is an example of JavaScript";
let b = "script";
console.log(a.includes(b));
Output:
Explanation:
In this example, we have changed the letter s to lowercase, and the include() method returned false. There is no substring "script," but there is "Script." SO users must remember that they should distinguish between uppercase and lowercase characters.
Also, when we use any character to check as a substring with keeping the case the same, the method will return true, and the first character of a string implies an index of zero, the second with an index of one, and so on.
Check Case-insensitive subsiting using includes() function
To perform a case-insensitive check, we convert both the string and the substring to either lowercase or uppercase using the toLowerCase() or toUpperCase() function, and then use the includes() function to check if the string contains the substring.
Code:
let a= "This is an example of JavaScript";
let b = "script";
let output = a.toLowerCase().includes(b.toLowerCase())
console.log(output);
document.getElementById("output").innerHTML = output;
Method 2: Using the indexOf() method to check substrings
The indexOf() method also helps to get the index of the substring that is present in the main string. It returns the index of the substring where it finds the search value for the first time.
Syntax:
string.indexOf(substring, index);
Parameters used:
The indexOf() method accepts two arguments, and these are as follows:
- Substring: This parameter represents a character or the series of characters users search for to check if this exists inside the parent string. This parameter is required.
- Index: This parameter specifies the index from which the above parameter will start the search for the substring. It returns a default value "zero" since indexing in programming languages begins at the 0th position. It is an optional parameter.
Code Snippet:
let a = "This is an example of JavaScript";
let b = "Script";
console.log(a.indexOf(b));
Output:
Explanation:
We used a variable a that contains the parent string and then checked the substring by passing a character or set of characters within variable "b." Here, we passed "Script," and the method will return the index of the first character of the substring, i.e., "S."
The output is 26, where the indexOf() method includes the white space between each word with an index. Also, users can search for single characters as the substring.
But when it does not find the character in the parent string, it returns -1. The index0f() method is case-sensitive, so users must distinguish between uppercase and lowercase characters.
Check Case-insensitive subsiting using indexOf() function
To perform a case-insensitive check, we convert both the string and the substring to either lowercase or uppercase using the toLowerCase() or toUpperCase() function, and then use the indexOf() function to check if the string contains the substring.
Code:
let a= "This is an example of JavaScript";
let b = "script";
let output = a.toLowerCase().includes(b.toLowerCase())
console.log(output);
document.getElementById("output").innerHTML = output;
Comparison between the include() and the indexOf() methods
- Users can use the includes() method that returns a Boolean value, either true or false, and using the indexOf() method, users will get a number based on the substring index.
- The include() method does not return any number but a Boolean value. And the indexOf() method will start evaluating from the starting index where the substring users are looking for is found inside the main string. It will return -1 if it does not get the substring in the parent string.
- Both these methods in JavaScript are case-sensitive.
Method 3: Using the array.some() method to check substrings
This method will help iterate over the string and find at least one of the items meeting the condition specified by the argument. If the substring meets the condition, it will return a Boolean value that can be either true or false.
Syntax:
array.some(callback(element,index,array),thisArg)
Parameters used:
- Callback: This parameter specifies the function the method will call for each element in the string.
- Element: This parameter specifies the value of the elements the method will process.
- Index: This parameter specifies the index of the current elements in the string that starts from zero. This parameter is optional.
- Array: This parameter specifies the complete string or array of strings, which the method will call the array.every. This parameter is optional.
- thisArg: This parameter specifies the context users will pass while executing the callback function.
Code Snippet:
const a = 'This is an example of JavaScript';
const array = ['an', 'of', 'script'];
const b = array.some(i => {
if (a.includes(i)) {
return true;
}
return false;
});
console.log(b);
Output:
Explanation:
We have used an array of strings that contains the parent string, and then we included the substring inside the array variable.
Then the variable "b" specifies the condition and the array.some() method gets called. If the method finds the substring, it will return a true otherwise, it will return "false" if it does not find the substring.
Method 4: Using the for loop to check substrings
Using this looping method, users can iterate over each character of the parent string and return a Boolean value if it finds the substring based on the condition.
Code Snippet:
const a = 'This is an example of JavaScript';
const array = ['an', 'of', 'script'];
let b = false;
for (const i of array) {
if (a.includes(i)) {
b = true;
break;
}
}
console.log(b);
Output:
Explanation:
Here, we used the for loop with the include() method to iterate over the array of strings and find whether the parent string includes the substring. It returns true if it finds the substring, else false.
Wrapping up:
We have discussed the approaches that users can utilize for checking a substring. These are efficient and well-structured, which allows users to check whether their parent or main string contains the substring in JavaScript.