Printing Javascript Template Strings with Line Breaks

Question

Is there a way to print (using console.log) javascript template strings, applying the substitutions when it's the case, but considering the linebreaks '\n' when printing?

For instance, when I have the following:

let someVar = 'a';

let tsString = `here goes ${someVar} 
some other line
some other line`;

console.log(tsString);

I'd like it to print WITH the linebreaks, not printing the \n's instead.

I think there could be some transformation between template strings and regular strings, but I could not find it.

*** EDIT: It happens on Terminal, not browser. Running a NodeJS app. Sorry for not specifying that, I assumed that what I wanted would be JS-specific, not node's (at least the solution).

Due to the way strings are parsed by HTML parsers, all unnecessary whitespace is removed (meaning line breaks). Is this simply a console annoyance? — Randy Casburn
– Randy Casburn, Commented Mar 23, 2018 at 18:50
@RandyCasburn As the question specifically refers to console.log that should not be an issue. — brunnerh
– brunnerh, Commented Mar 23, 2018 at 18:52
@H.B. - I get that, but you never know. If this is a console annoyance, it's a waste of time to even be here. But if it is a misunderstand between what is rendered in an HTML view vs. what is rendered in the console, perhaps we can help. Make sense? — Randy Casburn
– Randy Casburn, Commented Mar 23, 2018 at 18:54

pourmesomecode · Accepted Answer · 2020-02-20 09:24:44Z

5

+50

I think it may be related to the OS you're using since Windows and Mac have different character lengths for their line endings.

To answer the particular question which seems to work for me.

const os = require('os');

let someVar = 'a';

let tsString = `here goes ${someVar} ${os.EOL} some other line ${os.EOL} some other line`;

console.log(tsString);

You can read about the os middleware on the nodejs docs here: https://nodejs.org/api/os.html#os_os_eol

This seems to be a similar duplicate of: How do I create a line break in a JavaScript string to feed to NodeJS to write to a text file?

edited Feb 20, 2020 at 9:24

answered Feb 18, 2020 at 16:23

pourmesomecode

4,38812 gold badges54 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Gilad · Accepted Answer · 2020-02-18 16:13:16Z

2

Another solution besides adding to the string \n, which is the standard solution is as follows:

You've got there a character for new line:

(I cannot paste that character in here as the markdown kills it)

You could capture it in a variable and insert it in a template string:

const newline = tsString[12];
const myString = `Hello ${newline} World!`;

Hope it helps.

answered Feb 18, 2020 at 16:13

Gilad

435 bronze badges

Comments

Joe · Accepted Answer · 2020-02-20 03:52:44Z

2

You should try replacing the EOL based on where you are taking the content, forms as a standard should support the CRLF \r\n as per the spec (https://www.w3.org/TR/html401/interact/forms.html#h-17.13.4)

Use the following regex to replace all occurences. \n would match EOL and /gm would match all

let someVar = 'a';

let tsString = `here goes ${someVar} 
some other line
some other line`;

//For terminal (detects EOL on it's own)
console.log(tsString);
let txtString = tsString.replace(/\n/gm, `\r\n`);
// Works in terminal and in textarea
console.log(txtString); 
//For html content, redundant but if it's just html you want!
let htmlString = tsString.replace(/\n/gm, `<br>`);
console.log(htmlString);

answered Feb 20, 2020 at 3:52

Joe

6101 gold badge7 silver badges21 bronze badges

Comments

Arun Kumar · Accepted Answer · 2020-02-24 19:42:53Z

0

You can embed the data inside string like

const myTemplateString = My sample text 1 is ${one} My second line 2 is ${two}

console.log(myTemplateString) the ES6 will preserve white spaces and hence you can get the required line breaks. refer this article

answered Feb 24, 2020 at 19:42

Arun Kumar

3554 silver badges10 bronze badges

Collectives™ on Stack Overflow

Printing Javascript Template Strings with Line Breaks

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related