In this tutorial, let’s look at how to use the String startsWith method in JavaScript. This method can be used to check whether the string starts with a given substring/string/character.
Introduction to the String startsWith method
The base of the startsWith method is that it returns a true if the given string starts with the character/word/substring we’re searching for.
If not, it returns a false It doesn’t look beyond the start of the string until we specify otherwise. Let’s look at some examples to see how this method works:
let str = 'Hello there! This is my string!';
console.log(str.startsWith('H')); //returns true
console.log(str.startsWith('e')); //returns false
In the above example, we got a ‘true’ when since the string did indeed start with a ‘H’, but for an ‘e’, we got a ‘false’.
You can use this method as conditions in ternary operations or if else statements.
You can also search for full words or entire substrings, like below.
console.log(str.startsWith('Hello')); //returns true
console.log(str.startsWith('there!')); //returns false
console.log(str.startsWith('Hello there!')); //returns true
console.log(str.startsWith('This is my string!')); //returns false
The only condition is that the string should start with whatever you are searching for.
By default, if we give just one argument, the one for the substring we’re searching for, it’ll search in the beginning of the given string, but we can change this.
Specify the search position
We can specify the search position by specifying the position as the second argument, as in, from where you need to start the search.
Strings start with a position of 0 by default, so the 3rd position would actually be referred to by ‘2’, the 4th position would have an index of ‘3’ and so on. Please note that while counting positions in strings, you need to consider spaces and periods as well.
In the above example, if we searched the string from the position (index) 6, we’ll get a ‘true’, as shown below:
let str = 'Hello there! This is my string!';
console.log(str.startsWith('Hello', 6)); //returns false
console.log(str.startsWith('there!', 6)); //returns true
There you go! Now that we’re searching from the position 6, when we search for ‘Hello’, we get a false, but searching for ‘there!’, which does indeed start from the position 6, we get back a ‘true’.
Note: startsWith is not supported in the legacy browsers so use babel (or its equivalent) so make sure to transpile the code to the previous version of JavaScript (the one before ES6).
Ignore case with the startsWIth method
The startsWith method is case sensitive, so be aware of that. In the below example, ‘H’ will give us a true but ‘h’ will give us a false because, according to JavaScript ‘H’ and ‘h’ are not the same.
console.log(str.startsWith('H')); //returns true
console.log(str.startsWith('h')); //returns false
You can change this by using regular expressions and the ‘i’ flag to make the search case insensitive, like this:
console.log(str.startsWith(/H/i)); //returns true console.log(str.startsWith(/h/i)); //returns true
Regular expressions are a vast topic, and we won’t be able to cover everything there is in said topic in this article.
So, if you’d prefer not to confuse yourself with regular expressions, you can make things simple for yourself and just use the toLowerCase method to standardize both the string and the substring before performing the search, like this:
console.log(str.toLowerCase().startsWith('H'.toLowerCase())); //returns true
There you go! In this article, we’ve looked at the startsWith method and various ways of using it.