· JavaScript  · 2 min read

How To Split A String By Newline In JavaScript

In this tutorial, we’ll explore how to split a string by newlines using different methods in JavaScript.

In this tutorial, we’ll explore how to split a string by newlines using different methods in JavaScript.

Understanding Newline Characters

In JavaScript, newline characters can vary based on the operating system:

  • \n: Line feed (LF) used in Unix/Linux and modern macOS.
  • \r\n: Carriage return + line feed (CRLF) used in Windows.
  • \r: Carriage return (CR) used in older Mac systems.

To handle all these variations, we’ll use regular expressions in our split method.

Method 1: Using String.prototype.split()

The simplest way to split a string by newlines is using the split() method. Here’s how to do it:

Example Code

const multiLineString = 'Line 1\nLine 2\r\nLine 3\rLine 4';
const lines = multiLineString.split(/\r?\n|\r/);
console.log(lines);

Explanation

  • split(/\r?\n|\r/): This regular expression matches:
    • \r?\n: An optional carriage return followed by a line feed.
    • |\r: Or a standalone carriage return.

This ensures that regardless of the newline format, the string will be split correctly.

Output

[ 'Line 1', 'Line 2', 'Line 3', 'Line 4' ]

Method 2: Using String.prototype.match()

Another approach is to use the match() method with a regular expression. This method returns an array of matches.

Example Code

const multiLineString = 'Line 1\nLine 2\r\nLine 3\rLine 4';
const lines = multiLineString.match(/[^\r\n]+/g);
console.log(lines);

Explanation

  • match(/[^\r\n]+/g): This regular expression matches one or more characters that are not newline characters (\r or \n).
  • The g flag indicates a global search, which will find all matches in the string.

Output

[ 'Line 1', 'Line 2', 'Line 3', 'Line 4' ]

Method 3: Using String.prototype.split() with a More Detailed Regular Expression

If you want more control over the splitting process, you can create a more detailed regex pattern.

Example Code

const multiLineString = 'Line 1\nLine 2\r\nLine 3\rLine 4';
const lines = multiLineString.split(/(?:\r\n|\r|\n)/);
console.log(lines);

Explanation

  • split(/(?:\r\n|\r|\n)/): This pattern uses a non-capturing group (?: ... ) to specify that it should match either \r\n, \r, or \n.
  • This is similar to the first method but makes it clear that we’re splitting by any newline variation.

Output

[ 'Line 1', 'Line 2', 'Line 3', 'Line 4' ]

Conclusion

Splitting a string by newlines in JavaScript is straightforward, and there are multiple ways to accomplish it. Depending on your needs, you can choose between the split() method for simplicity, match() for capturing non-newline segments, or a detailed regex pattern for clarity.

Share:
Back to Blog

Related Posts

View All Posts »

JavaScript Remove http or https from URL

You can easily remove `http://` (or `https://`) from a URL in JavaScript using a combination of string methods or regular expressions. Here are a few approaches -

Higher-Order Functions in JavaScript

Higher-Order Functions in JavaScript

JavaScript higher-order functions let you treat functions like values—passing them as arguments, returning them, or storing them in variables.