# 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 👀

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.

# Resources

Next Tidbit
Strike Through Using HTML

Related Tidbits

Fresh Tidbits