Recently, I got a requirement to check if a string contains a substring in TypeScript. In this tutorial, I will explain how to check if a string contains a substring in TypeScript using different
Check if a String Contains a Substring in TypeScript
TypeScript, being a superset of JavaScript, inherits all string manipulation methods from JavaScript. One of the most common methods to check if a string contains a substring is the includes() method. However, there are other techniques as well, such as using indexOf() and regular expressions.
Let me show you each method with an example.
Using the includes() Method
The includes() method is quite easy to check if a string contains a substring in TypeScript. It returns true if the string contains the specified substring and false otherwise. This method is case-sensitive. Let me show you an example.
Example:
let cityName: string = "New York City";
let substring: string = "York";
if (cityName.includes(substring)) {
console.log(`${substring} is found in ${cityName}`);
} else {
console.log(`${substring} is not found in ${cityName}`);
}In this example, the output will be York is found in New York City because the substring “York” is present in the string “New York City”.
Check out Convert String to Number in TypeScript
Using the indexOf() Method
The indexOf() method returns the index of the first occurrence of the specified substring. If the substring is not found, it returns -1. This method is also case-sensitive.
Example:
let stateName: string = "California";
let substring: string = "for";
if (stateName.indexOf(substring) !== -1) {
console.log(`${substring} is found in ${stateName}`);
} else {
console.log(`${substring} is not found in ${stateName}`);
}In this case, the output will be for is found in California because the substring “for” is present in the string “California”.
I executed the above TypeScript code and you can see the exact output in the screenshot below:
Read Convert a String to Boolean in TypeScript
Using Regular Expressions
Regular expressions provide a powerful way to search for substrings within a string. The test() method of a regular expression object can be used to check if a substring exists.
Example:
let fullName: string = "John Doe";
let regex: RegExp = /Doe/;
if (regex.test(fullName)) {
console.log(`The name Doe is found in ${fullName}`);
} else {
console.log(`The name Doe is not found in ${fullName}`);
}Here, the output will be The name Doe is found in John Doe because the regular expression /Doe/ matches the substring “Doe” in the string “John Doe”.
Here is the exact output in the screenshot below:
Check out Convert String to Date in TypeScript
Case-Insensitive Search
Sometimes, you may need to perform a case-insensitive search. This can be achieved by converting both the string and the substring to the same case (either lower or upper) before performing the search.
Example:
let cityName: string = "San Francisco";
let substring: string = "san";
if (cityName.toLowerCase().includes(substring.toLowerCase())) {
console.log(`${substring} is found in ${cityName}`);
} else {
console.log(`${substring} is not found in ${cityName}`);
}In this example, the output will be san is found in San Francisco because both the string and the substring are converted to lowercase before the search.
Read Convert Date to String in TypeScript
Practical Examples
Now, let me show you some practical examples.
Validating User Input
Consider a scenario where you need to validate if a user’s input contains a specific keyword. This is common in form validations.
Example:
let userInput: string = "I live in Los Angeles";
let keyword: string = "Angeles";
if (userInput.includes(keyword)) {
console.log(`The input contains the keyword ${keyword}`);
} else {
console.log(`The input does not contain the keyword ${keyword}`);
}Searching Through Text
Another practical application is searching through a large body of text. For instance, you might want to check if a paragraph contains the name of a specific city.
Example:
let paragraph: string = "The Golden Gate Bridge in San Francisco is an iconic landmark.";
let city: string = "San Francisco";
if (paragraph.includes(city)) {
console.log(`The paragraph mentions ${city}`);
} else {
console.log(`The paragraph does not mention ${city}`);
}Filtering Data
You can also use these methods to filter data in an array. For example, filtering an array of city names to only include those that contain a specific substring.
Example:
let cities: string[] = ["New York", "Los Angeles", "Chicago", "Houston", "Phoenix"];
let filter: string = "o";
let filteredCities = cities.filter(city => city.includes(filter));
console.log(filteredCities);In this case, the output will be ["Los Angeles", "Houston", "Phoenix"] because these city names contain the substring “o”.
Conclusion
In this tutorial, we explored various methods to check if a string contains a substring in TypeScript. We covered the includes() method, indexOf() method, and regular expressions, along with practical examples.
I am Bijay Kumar, a Microsoft MVP in SharePoint. Apart from SharePoint, I started working on Python, Machine learning, and artificial intelligence for the last 5 years. During this time I got expertise in various Python libraries also like Tkinter, Pandas, NumPy, Turtle, Django, Matplotlib, Tensorflow, Scipy, Scikit-Learn, etc… for various clients in the United States, Canada, the United Kingdom, Australia, New Zealand, etc. Check out my profile.
