How to Split a String in JavaScript

What you’ll build or solve

You’ll convert a single string into an array of substrings.

When this approach works best

Splitting works best when you:

  • Parse delimited input like "apple,banana,orange" or "a|b|c".
  • Break a sentence into words for search, tagging, or previews.
  • Process multi-line text into lines.
  • Convert simple CSV-like values into arrays you can loop over.

Avoid splitting when the format is complex or nested, like JSON or HTML. In those cases, use a parser instead of string rules.

Prerequisites

  • A browser or Node.js installed
  • Basic understanding of strings and arrays

No additional setup is required.


Step-by-step instructions

Step 1: Use split() with string separators

Use split(separator) to break a string wherever the separator appears.

consttext="apple,banana,orange";
constfruits=text.split(",");

console.log(fruits);

Common separator choices:

constsentence="JavaScript is fun";
constwords=sentence.split(" ");

constword="hello";
constletters=word.split("");

console.log(words);
console.log(letters);

Limit the number of results by passing a second argument:

constcolorsText="red,green,blue,yellow";
constfirstTwo=colorsText.split(",",2);

console.log(firstTwo);

What to look for:

  • split() with no argument returns an array with the whole string as one item.
  • split("") creates one array item per character.
  • Order and content depend entirely on the separator you choose.

Step 2: Use split() with regular expressions

Use a regex when you want pattern matching, multiple separators, or flexible whitespace handling.

constdata="apple, banana; orange";
constitems=data.split(/[,;]\s*/);

console.log(items);

This splits on commas or semicolons and removes extra spaces after them.

What to look for:

  • Regex splitting helps when input is inconsistent, like mixed separators or uneven spacing.
  • If the pattern does not match, you’ll get a one-item array containing the original string.

Examples you can copy

Example 1: Extract first and last name

constfullName="Sara Connor";
constparts=fullName.split(" ");

constfirstName=parts[0];
constlastName=parts[1];

console.log(firstName);
console.log(lastName);

Example 2: Convert comma-separated numbers into real numbers

constinput="10,20,30,40";
constnumbers=input.split(",").map(Number);

console.log(numbers);

Example 3: Break multi-line text into an array of lines

consttext="Line one\nLine two\nLine three";
constlines=text.split("\n");

console.log(lines);

If your text uses Windows line endings, split on \r\n:

constwindowsText="Line one\r\nLine two\r\nLine three";
constlines=windowsText.split("\r\n");

console.log(lines);

Example 4: Get a file extension

constfilename="document.pdf";
constparts=filename.split(".");
constextension=parts[parts.length-1];

console.log(extension);

Common mistakes and how to fix them

Mistake 1: Forgetting the separator

What you might do:

consttext="apple,banana,orange";
constresult=text.split();

Why it breaks:

Without a separator, JavaScript returns the entire string as one element.

Correct approach:

constresult=text.split(",");

Mistake 2: Splitting on a separator that does not exist

What you might do:

constsentence="JavaScript is fun";
constwords=sentence.split(",");

Why it breaks:

There’s no comma in the string, so nothing gets split.

Correct approach:

constwords=sentence.split(" ");

Mistake 3: Getting empty strings from consecutive separators

What you might do:

consttext="apple,,orange";
constresult=text.split(",");

console.log(result);

Why it breaks:

Two separators in a row produce an empty string item.

Correct approach:

constresult=text
.split(",")
.filter(item =>item!=="");

console.log(result);

Troubleshooting

  • If you get only one array item, verify the separator exists in the string.
  • If you see empty strings, check for repeated separators, trailing separators, or multiple spaces, then filter results.
  • If numeric values stay as strings, convert them with .map(Number).
  • If line splitting fails, try \r\n for Windows text instead of \n.

Quick recap

  • Use split(separator) with a string separator like ",", " ", or "".
  • Use the second argument to limit results when you only need the first few items.
  • Use a regex separator when input has multiple separators or messy spacing.
  • Filter out empty strings when separators repeat.
  • Convert results with map() when you need numbers or other types.