JavaScript Strings

JavaScript String split

Written by Swapnil RajaPublished 24 Aug 2026

split turns a string into an array by cutting it at a separator.

It is the opposite of join, which turns an array back into a string.

Together they let you use array methods on text.

Example

javascript

const text = "a,b,c";

const parts = text.split(",");

console.log(parts.length);
console.log(parts[0]);

The output is 3 then a.

How split Works

The separator says where to cut, and is removed from the result.

An empty string separator splits into single characters.

No separator at all gives an array holding the whole string.

Syntax

javascript

text.split(separator);

The result is always an array.

Splitting into Words

A space is the usual separator for a sentence.

Example

javascript

const sentence = "the quick brown fox";

const words = sentence.split(" ");

console.log(words.length);
console.log(words[3]);

The output is 4 then fox.

Splitting into Characters

An empty separator gives one element per character.

Example

javascript

const word = "hello";

const letters = word.split("");

console.log(letters.length);
console.log(letters.reverse().join(""));

Reversing a string is usually done exactly this way.

Going Back with join

join rebuilds a string from the array.

Example

javascript

const parts = ["a", "b", "c"];

console.log(parts.join("-"));
console.log(parts.join(""));

The separator is up to you.

Using Array Methods on Text

Split, work on the array, then join back.

Example

javascript

const sentence = "the quick brown fox";

const capitalised = sentence
  .split(" ")
  .map(function (word) {
    return word[0].toUpperCase() + word.slice(1);
  })
  .join(" ");

console.log(capitalised);

This is a very common pattern for formatting text.

A Missing Separator

If the separator is not there, you get an array holding one item.

Example

javascript

const text = "no commas here";

const parts = text.split(",");

console.log(parts.length);
console.log(parts[0]);

The output is 1 then the whole string.

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript String split</title>
</head>
<body>

  <h1>String split</h1>

  <p id="out"></p>

  <script>
    const sentence = "the quick brown fox";

    const words = sentence.split(" ");
    const titled = words.map(function (w) {
      return w[0].toUpperCase() + w.slice(1);
    }).join(" ");

    document.getElementById("out").innerHTML =
      "Words: " + words.length +
      "<br>Reversed letters: " + sentence.split("").reverse().join("") +
      "<br>Title case: " + titled;
  </script>

</body>
</html>

Try It Yourself

Run the above example in the Try It Editor.

Try a different separator:

Split on the letter o and see how the pieces fall.

Important Points

split returns an array.
The separator is removed from the result.
An empty separator splits into characters.
join turns the array back into a string.
A missing separator gives a one-element array.

Conclusion

split and join are the bridge between strings and arrays.

Splitting lets you use map and filter on text.

Almost every text-formatting job goes through this pair.

PreviousJavaScript String replace NextJavaScript String trim