Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the JavaScript string newline character?

Is \n the universal newline character sequence in JavaScript for all platforms? If not, how do I determine the character for the current environment?

I'm not asking about the HTML newline element (<BR/>). I'm asking about the newline character sequence used within JavaScript strings.

like image 997
Landon Kuhn Avatar asked Jul 20 '09 20:07

Landon Kuhn


People also ask

What is string newline?

Adding Newline Characters in a String. Operating systems have special characters denoting the start of a new line. For example, in Linux a new line is denoted by “\n”, also called a Line Feed. In Windows, a new line is denoted using “\r\n”, sometimes called a Carriage Return and Line Feed, or CRLF.

Is newline a character or string?

A newline character, also known as the end of line (EOL), line break or line separator is a control character used to represent the end of a line and the beginning of a new one, separating both of them. In various programming languages including Java, there are multiple ways to add a new line in a string.

What character is newline?

LF (character : \n, Unicode : U+000A, ASCII : 10, hex : 0x0a): This is simply the '\n' character which we all know from our early programming days. This character is commonly known as the 'Line Feed' or 'Newline Character'.

Does \n work in JavaScript?

"\n" does work. If you do a document.


12 Answers

I've just tested a few browsers using this silly bit of JavaScript:

function log_newline(msg, test_value) {
  if (!test_value) { 
    test_value = document.getElementById('test').value;
  }
  console.log(msg + ': ' + (test_value.match(/\r/) ? 'CR' : '')
              + ' ' + (test_value.match(/\n/) ? 'LF' : ''));
}

log_newline('HTML source');
log_newline('JS string', "foo\nbar");
log_newline('JS template literal', `bar
baz`);
<textarea id="test" name="test">

</textarea>

IE8 and Opera 9 on Windows use \r\n. All the other browsers I tested (Safari 4 and Firefox 3.5 on Windows, and Firefox 3.0 on Linux) use \n. They can all handle \n just fine when setting the value, though IE and Opera will convert that back to \r\n again internally. There's a SitePoint article with some more details called Line endings in Javascript.

Note also that this is independent of the actual line endings in the HTML file itself (both \n and \r\n give the same results).

When submitting a form, all browsers canonicalize newlines to %0D%0A in URL encoding. To see that, load e.g. data:text/html,<form><textarea name="foo">foo%0abar</textarea><input type="submit"></form> and press the submit button. (Some browsers block the load of the submitted page, but you can see the URL-encoded form values in the console.)

I don't think you really need to do much of any determining, though. If you just want to split the text on newlines, you could do something like this:

lines = foo.value.split(/\r\n|\r|\n/g);
like image 125
mercator Avatar answered Oct 25 '22 12:10

mercator


Yes, it is universal.

Although '\n' is the universal newline characters, you have to keep in mind that, depending on your input, new line characters might be preceded by carriage return characters ('\r').

like image 25
Sinan Taifour Avatar answered Oct 25 '22 10:10

Sinan Taifour


Don't use "\n". Just try this:

var string = "this\
is a multi\
line\
string";

Just enter a backslash and keep on trucking! It works like a charm.

like image 45
Qasim Avatar answered Oct 25 '22 10:10

Qasim


It might be easiest to just handle all cases of the new line character instead of checking which case then applying it. For example, if you need to replace the newline then do the following:

htmlstring = stringContainingNewLines.replace(/(\r\n|\n|\r)/gm, "<br>");
like image 34
Quincy Avatar answered Oct 25 '22 11:10

Quincy


Yes, use \n, unless you are generating HTML code, in which case you want to use <br />.

like image 32
Finer Recliner Avatar answered Oct 25 '22 12:10

Finer Recliner


In an email link function, I use "%0D%0A":

function sendMail() {
    var bodydata="Before "+ "%0D%0A";
        bodydata+="After"

    var MailMSG = "mailto:[email protected]"
             + "[email protected]"
             + "&subject=subject"
             + "&body=" + bodydata;
    window.location.href = MailMSG;
}

HTML

<a href="#" onClick="sendMail()">Contact Us</a>
like image 42
ISCI Avatar answered Oct 25 '22 12:10

ISCI


You can use `` quotes (which are below the Esc button) with ES6. So you can write something like this:

var text = `fjskdfjslfjsl
skfjslfkjsldfjslfjs
jfsfkjslfsljs`;
like image 34
Bogdan Surai Avatar answered Oct 25 '22 12:10

Bogdan Surai


Get a line separator for the current browser:

function getLineSeparator() {
  var textarea = document.createElement("textarea");
  textarea.value = "\n"; 
  return textarea.value;
}
like image 26
Vitalii Fedorenko Avatar answered Oct 25 '22 11:10

Vitalii Fedorenko


A note - when using ExtendScript JavaScript (the Adobe Scripting language used in applications like Photoshop CS3+), the character to use is "\r". "\n" will be interpreted as a font character, and many fonts will thus have a block character instead.

For example (to select a layer named 'Note' and add line feeds after all periods):

var layerText = app.activeDocument.artLayers.getByName('Note').textItem.contents;
layerText = layerText.replace(/\. /g,".\r");
like image 23
JayCrossler Avatar answered Oct 25 '22 10:10

JayCrossler


printAccountSummary: function()
    {return "Welcome!" + "\n" + "Your balance is currently $1000 and your interest rate is 1%."}
};
console.log(savingsAccount.printAccountSummary()); // Method

Prints:

Welcome!
Your balance is currently $1000 and your interest rate is 1%.
like image 44
Barbs G Avatar answered Oct 25 '22 10:10

Barbs G


I had the problem of expressing newline with \n or \r\n.
Magically the character \r which is used for carriage return worked for me like a newline.
So in some cases, it is useful to consider \r too.

like image 44
Oralet Avatar answered Oct 25 '22 11:10

Oralet


I believe it is -- when you are working with JavaScript strings.

If you are generating HTML, though, you will have to use <br /> tags (not \n, as you're not dealing with JavaScript any more).

like image 33
Pascal MARTIN Avatar answered Oct 25 '22 10:10

Pascal MARTIN