What Is the JavaScript String Newline Character

What is the JavaScript string newline character?

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', `barbaz`);

<textarea id="test" name="test">
</textarea>

JavaScript string with new line - but not using \n

The reason it is not working is because javascript strings must be terminated before the next newline character (not a \n obviously). The reason \n exists is to allow developers an easy way to put the newline character (ASCII: 10) into their strings.

When you have a string which looks like this:

//Note lack of terminating double quote
var foo = "Bob 

Your code will have a syntax error at that point and cease to run.

If you wish to have a string which spans multiple lines, you may insert a backslash character '\' just before you terminate the line, like so:

//Perfectly valid code
var foo = "Bob \
is \
cool.";

However that string will not contain \n characters in the positions where the string was broken into separate lines. The only way to insert a newline into a string is to insert a character with a value of 10, the easiest way of which is the \n escape character.

var foo = "Bob\nis\ncool.";

Sending newline character in Javascript string

If you're trying to catch it with RegEx, or something similar, that will still catch \n even if it displays as two lines. If you must have it as a literal, you can escape the backslash.

E.g.

var str = "Result1\\nResult2";

Here's a bit of a visual example using the RegEx search in Atom.

The highlighted part is the selection. As you can see, a new line character is selected when performing a RegEx search using \n, regardless of if it's actually shown as \n.

How do I create a new line in Javascript?

Use the \n for a newline character.

document.write("\n");

You can also have more than one:

document.write("\n\n\n"); // 3 new lines!  My oh my!

However, if this is rendering to HTML, you will want to use the HTML tag for a newline:

document.write("<br>");

The string Hello\n\nTest in your source will look like this:

Hello!

Test

The string Hello<br><br>Test will look like this in HTML source:

Hello<br><br>Test

The HTML one will render as line breaks for the person viewing the page, the \n just drops the text to the next line in the source (if it's on an HTML page).

Insert newline character in string javascript

innerHTML

What happens if you put a new line character in HTML source code?

NewLine!

JavaScript Newline Character

Split it on /\r?\n/, in case the string includes the carriage returns with newlines.

join it with '\n', in any browser and any os.

How to replace a new line character in Javascript?

"\n" is a newline character. You're replacing them with what's already there, leaving the String unchanged. If you want the actual characters \ and n, you need to mask the backslash \\n and insert that.

New line character in output file

I think you may need to encode your data, which you can do with encodeURIComponent().

Try this:

var textToSend = string1+"\r\n"+string2+"\r\n"+string3;
textToSend = encodeURIComponent(textToSend);
this.downloadButton.setAttribute('href', 'data:text/plain;charset=utf-8,' + textToSend)

---

Related Topics