javascript - es6 多行模板字符串，没有新行并允许缩进

Question

这些天在大多数工作中越来越多地使用 es6。一个警告是模板字符串。

我喜欢将我的行字符数限制为 80。因此，如果我需要连接一个长字符串，它可以正常工作，因为连接可以是多行，如下所示:

const insert = 'dog';
const str = 'a really long ' + insert + ' can be a great asset for ' +
  insert + ' when it is a ' + dog;

但是，尝试使用模板文字执行此操作只会给您一个多行字符串，其中 ${insert} 将 dog 放在结果字符串中。当您想将模板文字用于 url 组装等时并不理想。

我还没有找到一个很好的方法来保持我的行字符限制并且仍然使用长模板文字。有人有什么想法吗？

另一个标记为已接受的问题只是部分答案。下面是我之前忘记包含的模板文字的另一个问题。

使用换行符的问题在于，如果不在最终字符串中插入空格，则不允许缩进。即

const insert = 'dog';
const str = `a really long ${insert} can be a great asset for\
  ${insert} when it is a ${insert}`;

生成的字符串如下所示:

a really long dog can be a great asset for  dog when it is a dog

总体而言，这是一个小问题，但如果有允许多行缩进的修复程序将会很有趣。

Answer 1

这个问题有两个答案，但只有一个可能被认为是最优的。

在模板字面量内部，javascript 可以在表达式内部使用，例如 ${}。因此，可以缩进多行模板文字，如下所示。需要注意的是，表达式中必须存在一些有效的 js 字符或值，例如空字符串或变量。

const templateLiteral = `abcdefgh${''
  }ijklmnopqrst${''
  }uvwxyz`;

// "abcdefghijklmnopqrstuvwxyz"

此方法使您的代码看起来像废话。不推荐。

第二种方法是由@SzybkiSasza 推荐的，似乎是可用的最佳选择。出于某种原因，我并没有尽可能地想到连接模板文字。我很蠢。

const templateLiteral = `abcdefgh` +
  `ijklmnopqrst` +
  `uvwxyz`;

// "abcdefghijklmnopqrstuvwxyz"