A string is a data structure that represents a sequence of characters, and an array is a data structure that contains multiple values.

And did you know – a string can be broken apart into an array of multiple strings using the split method. Let's see how that works with some examples.


If you just want the code, here you go:

const publisher = 'free code camp'
publisher.split(' ') // [ 'free', 'code', 'camp' ]


According to the MDN, the syntax you'll need to split the string is str.split([separator[, limit]]). If we apply this to the above example:

  • str is publisher
  • separator is ' '
  • there is no limit

When do you need to split a string?

Example 1: getting part of a string

Here is a common example which involves getting the token from an auth header that is part of a Token-based Authentication System.

If this doesn't mean anything to you that's ok. All you need to know for the following example is that there is a string with the value bearer token, but only token is needed (as this is the part that identifies the user):

const authHeader = 'bearer token'
const split = authHeader.split(' ') // (1) [ 'bearer', 'token' ]
const token = split[1] // (2) token

Here's what's happening in the above code:

  1. The string is split with ' ' as the separator
  2. The second entry in the array is accessed

Example 2: apply array methods to a string

Often the input you are given is a string, but you want to apply array methods to it (eg. map, filter, or reduce).

For example, let's say you are given a string of morse code and you want to see what it reads in English:

const morse = '-.-. --- -.. .'
// (1)
const morseToChar = {
  '-.-.': 'c',
  '-..': 'd',
  '.': 'e',
  '---': 'o',

const morseArray = morse.split(' ') // (2) [ '-.-.', '---', '-..', '.' ]
const textArray = morseArray.map((char) => morseToChar[char]) // (3) [ 'c', 'o', 'd', 'e' ]
const text = textArray.join(") // (4)

Here's what's happening in the above code:

  1. An object literal is created to map morse chars to the English alphabet
  2. The morse code is split into an array with a ' ' as the separator. (Without ' ' as an argument you would end up with an array that has separate entries for each . and -.)
  3. The morse code array is mapped/transformed to a text array
  4. A string is created from the array with '' as the separator. (Without '' as an argument the output would be c,o,d,e.)

How to add a limit to split

According to the MDN, it is also possible to pass a limit as an argument to split. I have never needed to do this, but here is how you could apply it:

const publisher = 'free code camp'
publisher.split(' ', 1) // [ 'free' ]

In the above example, the array is limited to one entry. Without it the value of the array would be [ 'free', 'code', 'camp' ].

Before you go…

Thank you for reading this far! I write about my professional and educational experiences as a self-taught software developer, so feel free to check out my website or subscribe to my newsletter for more content.

You might also like: