Template Strings ES6 prevent line breaks
I have a long string, which I build using ES6 template strings, but I want it to be without line breaks:
var string = `As all string substitutions in Template Strings are JavaScript
expressions, we can substitute a lot more than variable names.
For example, below we can use expression interpolation to
embed for some readable inline math:`
console.log(string);
Result:
As all string substitutions in Template Strings are JavaScript
expressions, we can substitute a lot more than variable names.
For example, below we can use expression interpolation to
embed for some readable inline math:
My expectations:
As all string substitutions in Template Strings are JavaScript expressions, we can substitute a lot more than variable names. For example, below we can use expression interpolation to embed for some readable inline math:
This is insane.
Almost every single answer here suggest running a function runtime in order to well-format, buildtime bad-formatted text oO Am I the only one shocked by that fact, especially performance impact ???
As stated by @dandavis, the official solution, (which btw is also the historic solution for unix shell scripts), is to escape the carriage return, well, with the escape character : \
`foo \
bar` === 'foo bar'
Simple, performant, official, readable, and shell-like in the process
A line break is a line break... If you produce them manually, I find very expectable that you get them during run-time.
BTW, I find three workarounds for now:
Configure your IDE or code editor to do word wrap so you won't need to add line breaks in your code if you don't need them: your editor will break your code in two or more lines if each code sentence goes beyond configured maximum characters.
Remove line breaks with
String.prototype.replace
:
var string = `As all string substitutions in Template Strings are JavaScript expressions, we can substitute a lot more than variable names. For example, below we can use expression interpolation to embed for some readable inline math:`.replace(/\n/gm,"");
Caution: here you're running a function runtime to format your buildtime code, which might look like an anti-pattern, and have performance impact
- Perform these code line breaks using concatenations:
var string = `As all string substitutions in Template Strings are JavaScript` + `expressions, we can substitute a lot more than variable names.` + `For example, below we can use expression interpolation to` + `embed for some readable inline math:`;
In my case, I would go with #1 option.
If you have ES6, you can use tags. For instance, the stripIndent tag from the common-tags library:
Install via:
npm install common-tags --save
Require via:
const stripIndent = require('common-tags/lib/stripIndent')
Use as:
stripIndent`
As all string substitutions in Template Strings are JavaScript
expressions, we can substitute a lot more than variable names.
For example, below we can use expression interpolation to
embed for some readable inline math:
`
Edit: As mentioned in the comments, you likely need to pick the: const oneLine = require('common-tags/lib/oneLine')
tag for your desired outcome.
More info on the aforementioned common-tags link as well as on this blog
Either configure IDE to make wraps and use template string 1-liner, as in your 1st code snippet.
-
Either use
\
escape literal char just before the line breaks.Example:
const string = `1st line\ 2nd line\ 3rd line`;
But it will not save you from issues with space-aligning.
-
Either use old-school ES5 concatenation with '+'.
Example:
const string = '1st line' + '2nd line' + '3rd line';
-
Either use hack with template empty string var ${''}:
Example:
const string = `1st line${'' }2nd line${'' }3rd line`;
The 1st way is much more better, cause:
- less symbols (size aspect)
- no runtime operations (perfomance aspect)