How to remove all line breaks from a string using JavaScript?

23 May, 2019
Line breaks in strings vary from platform to platform, but the most common ones are the following:
Windows: \r\n carriage return followed by newline character.
Linux: \n just a newline character.
Older Macs: \r just a carriage return character.
There are two methods to accomplish this task. One of the ways is by using traditional programming loop and visiting every character one at a time. Another is using Regular Expressions.
The slice and stitch method: It is the basic way to realize the solution to this problem. Visit each character of the string and slice them in such a way that it removes the newline and carriage return characters.
Code snippet:
var newstr = "";for( var i = 0; i < str.length; i++ )     if( !(str[i] == '\n' || str[i] == '\r') )        newstr += str[i];
All this code snippet does it just copy all the characters that are not “newline” or “carriage return” to another variable. However, there are a lot of overheads in this solution and therefore not an optimal way to remove newlines.
Regular Expression: This method uses regular expressions to detect and replace newlines in the string. It is fed into replace function along with string to replace with, which in our case is an empty string.
String.replace( regex / substr, replace with )
The regular expression to cover all types of newlines is
/\r\n|\n|\r/gm
As you can see that this regex has covered all cases separated by | operator. This can be reduced to
/[\r\n]+/gm
where g and m are for global and multiline flags.
Code snippet:
function remove_linebreaks( var str ) {    return str.replace( /[\r\n]+/gm, "" );}
The best part is that this method performed almost 10 times better than the previous one.
Example:
<!DOCTYPE html><html>  <head>    <title>        Remove all line breaks from        a string using JavaScript    </title>          <script>    // Method 1          // Slice and Stitch    function remove_linebreaks_ss( str ) {        var newstr = "";                  for( var i = 0; i < str.length; i++ )             if( !(str[i] == '\n' || str[i] == '\r') )                    newstr += str[i];                              return newstr;    }           // Method 2          // Regular Expression    function remove_linebreaks( str ) {        return str.replace( /[\r\n]+/gm, "" );    }          function removeNewLines() {        var sample_str =            document.getElementById('raw-text').value;                  console.time();                   // For printing time taken on console.        document.getElementById('res-1').innerHTML                = remove_linebreaks_ss( sample_str );        console.timeEnd();                  console.time();        document.getElementById('res-2').innerHTML                = remove_linebreaks( sample_str);        console.timeEnd();    }    </script></head>  <body>    <center>        <textarea id="raw-text"></textarea>        <br>              <button onclick="removeNewLines()">            Remove Newlines        </button>              <h6>Method 1:</h6>        <p id='res-1'></p>              <h6>Method 2:</h6>        <p id='res-2'></p>    </center></body>  </html>                
Output:
Before Clicking on the button:
After Clicking on the button:
javascript-string
Picked
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.