Check if a String starts with Substring in JavaScript

Table of Contents #

1. Check if String starts with Substring in JavaScript
2. Check if String starts with one of multiple Values in JavaScript

Check if String starts with Substring in JavaScript #

Use the String.startsWith() method to check if a string starts with a substring, e.g. if (str.startsWith(substring)) {}.

The startsWith() method will return true if the string starts with the substring and false otherwise.

Copied!
const str = 'bobbyhadz.com';

if (str.startsWith('bobby')) {
  // 👇️ this runs
  console.log('✅ string starts with substring');
} else {
  console.log('⛔️ string does NOT start with substring');
}

console.log(str.startsWith('bobby')); // 👉️ true
console.log(str.startsWith('abc')); // 👉️ false

We used the String.startsWith method to check if a string starts with a specific substring.

The method returns a boolean result:

• true if the string starts with the substring
• false if it doesn't

Copied!
const str = 'BOBBYHADZ.COM';
const substr = 'bobby';

if (str.toLowerCase().startsWith(substr.toLowerCase())) {
  // 👇️ this runs
  console.log('✅ string starts with substring');
} else {
  console.log('⛔️ string does NOT start with substring');
}

Converting the string and the substring to lowercase enables us to perform a case-insensitive test for whether the string starts with the substring.

Alternatively, you can use the String.indexOf() method.

Check if String starts with Substring using indexOf #

Use the String.indexOf() method to check if a string starts with a substring, e.g. if (str.indexOf(substring) === 0) {}.

If the indexOf() method returns 0, then the string starts with the substring, otherwise, it doesn't.

Copied!
const str = 'bobbyhadz.com';
const substr = 'bobby';

if (str.indexOf(substr) === 0) {
  // 👇️ this runs
  console.log('✅ string starts with substring');
} else {
  console.log('⛔️ string does NOT start with substring');
}

The String.indexOf method returns the index of the first occurrence of a substring in a string.

If the substring is not contained in the string, the method returns -1.

If the method returns 0, then the string starts with the substring.

You can also use the RegExp.test() method to check if a string starts with a substring.

Check if String starts with Substring using Regex #

Use the RegExp.test() method to check if a string starts with a substring.

The method will return true if the string starts with the supplied substring and false otherwise.

Copied!
if (/^abc/.test('abc123')) {
  // 👇️ this runs
  console.log('✅ string starts with abc');
} else {
  console.log('⛔️ string does NOT start with abc');
}

We used the RegExp.test method to check if a string starts with a specific substring.

The method returns true if the regular expression is matched in the string and false otherwise.

The forward slashes / / mark the start and end of the regular expression.

The caret ^ matches the beginning of the input.

In this example, we check if the string abc123 starts with the substring abc.

If you want to make the regular expression case insensitive, add the i flag.

Copied!
// 👇️ with `i` flag
if (/^abc/i.test('ABC123')) {
  // 👇️ this runs
  console.log('✅ string starts with abc');
} else {
  console.log('⛔️ string does NOT start with abc');
}

The i flag allows us to perform case insensitive search in the string.

If you ever need help reading a regular expression, check out this regular expression cheatsheet by MDN.

It contains a table with the name and the meaning of each special character with examples.

Check if String starts with one of multiple Values in JavaScript #

Use the String.startswith() method with the logical OR (||) operator to check if a string starts with one of multiple values.

If the string starts with one of the specified values, true is returned, otherwise, false is returned.

Copied!
const str = 'one two three';

if (str.startsWith('one') || str.startsWith('two')) {
  // 👇️ this runs
  console.log('✅ string starts with one of the values');
} else {
  console.log('⛔️ string does NOT start with either value');
}

We used the String.startsWith method to check if a string starts with a specific substring.

The logical OR (||) operator allows us to chain multiple conditions.

If either call to the startsWith() method returns true, our if block will run.

You can use this approach to chain as many conditions as necessary.

Copied!
const str = 'one two three';

if (str.startsWith('one') || str.startsWith('two') || str.startsWith('three')) {
  // 👇️ this runs
  console.log('✅ string starts with one of the values');
} else {
  console.log('⛔️ string does NOT start with either value');
}

Alternatively, you can use the Array.some() method.

Check if a string starts with one of multiple values using some() #

To check if a string starts with one of multiple values:

1. Wrap the multiple values in an array.
2. Use the Array.some() method to iterate over the array.
3. Check if the string starts with each value and return the result.

Copied!
function startsWithOne(string, values) {
  return values.some(element => {
    return string.startsWith(element);
  });
}

const str = 'one two three';

// 👇️ true
console.log(startsWithOne(str, ['one', 'two', 'three']));

// 👇️ false
console.log(startsWithOne(str, ['abc', 'xyz']));

We wrapped the multiple values we want to test for in an array.

The function we passed to the Array.some method gets called with each element in the array.

On each iteration, we check if the string starts with the current value and return the result.

The some() method short-circuits and returns true if the callback function returns a truthy value at least once, otherwise, false is returned.

Alternatively, you can use the String.indexOf() method.

Check if String starts with one of multiple Values using String.indexOf() #

To check if a string starts with one of multiple values:

1. Chain multiple calls to the String.indexOf() method with the logical OR (||) operator.
2. If the String.indexOf() method returns 0 for any of the calls, the string starts with one of the values.

Copied!
const str = 'one two three';

if (str.indexOf('one') === 0 || str.indexOf('two') === 0) {
  console.log('✅ string starts with either value');
} else {
  console.log('⛔️ string does NOT start with either value');
}

The String.indexOf method returns the index of the first occurrence of a substring in a string.

If the substring is not contained in the string, the method returns -1.

If the substring is found in the string at index 0, then the string starts with the substring.

If either call to the indexOf method returns 0, our if block will run.