模板字符串ES6防止换行

我有一个长字符串，使用ES6模板字符串构建，但是我希望它没有换行符：

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);

结果：

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:

我的期望：

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:

疯了吧。

这里几乎每个答案都建议运行一个函数运行时程序，以便对格式正确的，构建时格式错误的文本进行操作。我是唯一一个对此事实感到震惊的人，尤其是对性能的影响吗？

如@dandavis所述，正式的解决方案（同时也是unix shell脚本的历史解决方案）是使用转义符来转义回车：\

`foo \
bar` === 'foo bar'

在此过程中简单，高效，正式，易读且类似于shell

一个换行符就是一个换行符...如果您手动生产它们，我非常希望您可以在运行时得到它们。

顺便说一句，我现在发现三种解决方法：

1. 将您的IDE或代码编辑器配置为自动换行，这样就不需要在代码中添加换行符：如果每个代码语句超出配置的最大值，则编辑器会将代码分成两行或更多行字符。

2. 删除换行符String.prototype.replace：

var string =`由于模板字符串中的所有字符串替换都是JavaScript
表达式，我们可以用变量名代替很多东西。
例如，下面我们可以使用表达式插值
嵌入一​​些可读的嵌入式数学：`.replace（/ \ n / gm，“”）;

注意：这里您正在运行函数运行时来格式化您的构建时代码，这看起来像是反模式，并且会对性能产生影响

3. 使用串联执行以下代码换行符：

var string =`因为模板字符串中的所有字符串替换都是JavaScript`
              +表达式，我们可以用变量名称代替很多东西。
              +`例如，下面我们可以使用表达式插值来` 
              +`嵌入一些可读的嵌入式数学：`;

就我而言，我会选择＃1选项。

如果您拥有ES6，则可以使用标签。例如，common-tags库中的stripIndent标记：

通过以下方式安装：

npm install common-tags --save

要求通过：

const stripIndent = require('common-tags/lib/stripIndent')

用于：

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:        
`

编辑：如评论中所述，您可能需要选择：const oneLine = require('common-tags/lib/oneLine')标记以获得所需的结果。

有关上述通用标签链接以及此博客的更多信息

• 如您的第一段代码中所示，将IDE配置为自动换行并使用模板字符串1-liner。

• 请\在换行符之前使用转义文字char。

  例：

  const string = `1st line\
  2nd line\ 
  3rd line`; 
  

  但这不会使您摆脱空间对齐问题。

• 要么将老式的ES5串联使用“ +”。

  例：

  const string = '1st line' + 
                 '2nd line' + 
                 '3rd line'; 
  

• 将hack与模板空字符串var $ {''}一起使用：

  例：

  const string = `1st line${'' 
                 }2nd line${'' 
                 }3rd line`;
  

第一种方法更好，原因是：

• 更少的符号（尺寸方面）
• 没有运行时操作（性能方面）

我个人更喜欢加入数组的外观：

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:`
].join(' ');

对于段落，您可以使用\s+正则表达式将单个空格替换为单个空格，这样它将适用于换行符和缩进。因此，根据您的情况，只需.replace(/\s+/gm, ' ')在末尾添加即可。

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(/\s+/gm, ' ');

console.log(string);

在ES6中，我更喜欢在这里\结合使用两个最佳答案（与结合使用.replace()）。将替换功能与转义字符结合使用的好处是，您可以使代码块与其余代码保持一致的格式。

/\s{2}/g 是一个正则表达式，它选择两个或多个背对背空格的任何实例。

const myMessage = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis id urna \
    ligula. Suspendisse lobortis ex ut vestibulum venenatis. Donec imperdiet ante odio, \
    nec malesuada diam tristique eget. Lorem ipsum dolor sit amet, consectetur adipiscing \
    elit. Cras in vulputate tellus.`
  .replace(/\s{2,}/g, "");

这将输出一个无中断的纯字符串。

“ Lorem ipsum dolor坐满，礼节高贵。Duisid urnaligula。Suspendisselobortis ex utvesibulumvenenatis。Donecimperdiet ante dioo，新的malesuada diam tristiqueeget。Loremipsum dolor坐席，高贵。”