String startsWith() Method in JavaScript

If you ever need to check if a string begins with another string, use ES6's startsWith method. I really like this method because intuitively it's so comprehensive. Even if you don't know have any tech background, just by reading the code, you can more easily deduce what's happening in comparison to indexOf 🤓

I really like the direction JavaScript is going. Not just introducing all these helpful methods, but evolving the language to be more human readable. This is how we make tech more accessible. Make it easier to learn. Love it! 😍

const lunch = '🥗 🥪 🍮'

// Old Way
lunch.indexOf('🥗') === 0 // true

// ✅ ES6 Way
lunch.startsWith('🥗') // true

startsWith() Parameters

The startsWith method accepts 2 parameters:

1. Search Value
2. Starting Index

1. Search Value

This is a required field. Here is where you pass your search value. This can be a single character or longer. Let's see some examples

Single Character

const name = 'Samantha Ming';

name.startsWith('S'); // true
name.startsWith('M'); // false

Multiple Characters

const name = 'Samantha Ming';

name.startsWith('Sam'); // true
name.startsWith('Min'); // false

Multiple Words

const name = 'Samantha Ming';

name.startsWith('Samantha M'); // true
name.startsWith('antha Min'); // false

Entire String

const name = 'Samantha Ming';

name.startsWith('Samantha Ming'); // true

Exceeding String's Length

const name = 'Samantha Ming';

name.startsWith('Samantha Ming is the best'); // false ← 😅

2. Starting Index

So by default, your starting index is going to be 0. But with this parameter, you can make it start at a different starting position. Let's take a look at a few examples.

Default Index (0)

const name = 'Samantha Ming';

name.startsWith('S'); // true
name.startsWith('S', 0); // true

Start at the 1st index

For those new to programming. Please note that JavaScript is zero-based. Meaning the count begins at 0. So the first character is at 0 index, the second character is at 1 index 🤓

const name = 'Samantha Ming';

name.startsWith('am', 1); // true
name.startsWith('am'); // false

Start at the 2nd index

Following our zero-based counting, the 2nd index is equal to the 3rd character.

const name = 'Samantha Ming';

name.startsWith('ma', 2); // true
name.startsWith('ma'); // false

Negative Starting Index

So negative index won't work. I was trying to be clever to test if negative index would work similarly like slice() where if you pass a negative index, it would be the last character. Proof again, don't think you can outsmart JavaScript 😂

const name = 'Samantha Ming';

name.startsWith('g', -1); // false

I guess that's what endsWith is for. I'll cover this in a future tidbit 😜

Case Sensitive

One important thing to keep in mind is the startWith method is case sensitive.

const name = 'Samantha Ming';

name.startsWith('sam'); // false

Browser Support

This is supported by all modern browser. Except for .... I'm sure you guessed it -- no Internet Explorer 😑. You will need to use a Polyfill or a compiler like Babel.

Browser Support

Community Inputs

💬 What other way do you know of checking if a string begins with something?

This is the question I asked the community. Got some really good ones. Let's take a look 👀

Using Search

const lunch = '🥗🥪☕️';
const search = '🥗';
lunch.slice(0, search.length) === search;

Thanks: @abraham

Using Regex

'some string'.match(/^some/);

// OR
(/^some/).test('some string');

Thanks: @cpt_silverfox

Using Bracket

If you're just checking for one singular character, you can try this. But note when you have more than character (ie. hel), this method won't work.

const word = 'hello';

word[0] === 'h';

Thanks: @neutrino2211

Performance Check

@gwardwell: Here’s one such test (found on JSPerf, I didn’t author it) that would indicate indexOf blows startsWith away.

• jsPerf: starsWith

Resources

• MDN Web Docs: startsWith
• w3schools: startsWith
• Stack Overflow: How to check if a string “StartsWith” another string?
• How to check if a string starts with another in JavaScript

Thanks for reading ❤
Say Hello! Instagram | Twitter | Facebook | Blog | SamanthaMing.com