es6多行模板字符串，不带新行并允许缩进 [英] es6 multiline template strings with no new lines and allow indents

问题描述

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

Been using es6 more and more for most work these days. One caveat is template strings.

我喜欢将我的行字符数限制为80.因此，如果我需要连接一个长字符串，它工作正常，因为连接可以是多个这样的行：

I like to limit my line character count to 80. So if I need to concatenate a long string, it works fine because concatenation can be multiple lines like this:

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

然而，尝试使用模板文字做到这一点只会给你一个多行字符串$ {插入}将狗放在结果字符串中。当您想要使用模板文字，如url装配等等时，不太理想。

However, trying to do that with template literals would just give you a multi-line string with ${insert} placing dog in the resulting string. Not ideal when you want to use template literals for things like url assembly, etc.

我还没有找到一个很好的方法来维持我的线性字符限制，并仍然使用长模板文字。任何人都有一些想法？

I haven't yet found a good way to maintain my line character limit and still use long template literals. Anyone have some ideas?

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

The other question that is marked as an accepted is only a partial answer. Below is another problem with template literals that I forgot to include before.

使用新行字符的问题是它不允许缩进，而不会在最后的字符串即

The problem with using new line characters is that it doesn't allow for indentation without inserting spaces into the final string. i.e.

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

生成的字符串如下所示：

The resulting string looks like this:

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

$ b总而言之，这是一个小问题，但是如果有一个修复来允许多行缩进，这将是有趣的。

Overall this is a minor issue but would be interesting if there was a fix to allow multiline indenting.

推荐答案

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

Two answers for this problem, but only one may be considered optimal.

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

Inside template literals, javascript can be used inside of expressions like ${}. Its therefore possible to have indented multiline template literals such as the following. The caveat is some valid js character or value must be present in the expression, such as an empty string or variable.

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

// "abcdefghijklmnopqrstuvwxyz"

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

This method makes your code look like crap. Not recommended.

第二种方法是由@SzybkiSasza推荐的，似乎是最好的选择。由于某种原因，我并没有发生连接模板文字。我是derp。

The second method was recommended by @SzybkiSasza and seems to be the best option available. For some reason concatenating template literals didn't occur to me as possible. I'm derp.

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

// "abcdefghijklmnopqrstuvwxyz"

这篇关于es6多行模板字符串，不带新行并允许缩进的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！