JavaScript - How to Check if a String "StartsWith" Another String in JavaScript?

Here are the various methods to check if a string starts with another string in JavaScript

1. Using String.startsWith() Method

The most widely used method is the startsWith() method, built into JavaScript. This method is simple to use, highly readable, and performs the task efficiently.

let s = 'Hello World';
let pre = 'Hello';
if (s.startsWith(pre)) {
    console.log(`The string starts with "${pre}"`);
} else {
    console.log(`The string does not start with "${pre}"`);
}

The string starts with "Hello"

• startsWith() checks if the string begins with the substring prefix.
• It returns true if the condition is met, otherwise false.
• This method is case-sensitive and takes an optional second parameter to specify the position in the string to start the search.

2. Using String.slice() Method

If you're working with older versions of JavaScript or need to perform additional manipulation, slice() can also be used to extract the beginning of a string and compare it to a target substring.

let s = 'Hello World';  
let prefix = 'Hello';   
if (s.slice(0, prefix.length) === prefix) {
    console.log(`The string starts with "${prefix}"`);
} else {
    console.log(`The string does not start with "${prefix}"`);
}

The string starts with "Hello"

• slice(0, prefix.length) extracts the portion of the string from the start (0) to the length of the prefix.
• If the extracted portion matches the prefix, it confirms that the string starts with that substring.

3. Using String.indexOf() Method

Another approach is to use indexOf(), which returns the position of the first occurrence of the specified substring. If the index is 0, it indicates that the string starts with the given substring.

let s = 'Hello World';
let prefix = 'Hello'; 
if (s.indexOf(prefix) === 0) {
    console.log(`The string starts with "${prefix}"`);
} else {
    console.log(`The string does not start with "${prefix}"`);
}

• indexOf() returns 0 if the substring is found at the start of the string.
• This method works well but may be less used compared to startsWith().

4. Using String.substr() Method

You can also use the substr() method to extract a portion of the string and compare it to the desired substring. While this method is deprecated in some environments, it still works in most modern browsers.

let s = 'Hello World';
let prefix = 'Hello';
if (s.substr(0, prefix.length) === prefix) {
    console.log(`The string starts with "${prefix}"`);
} else {
    console.log(`The string does not start with "${prefix}"`);
}

• substr(0, prefix.length) extracts the first prefix.length characters from the string.
• The extracted portion is compared with the prefix to check if the string starts with it.

Which Approach to Choose?

The startsWith() method is the simplest and most efficient solution for modern JavaScript. If you're working with older versions of JavaScript or need to manipulate the string in other ways, alternatives like slice(), indexOf(), and substr() are still valid options, though they may require more lines of code and less intuitive logic.