26

这些天来，在大多数工作中越来越多地使用 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 汇编等时，这并不理想。

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

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

使用换行符的问题是它不允许缩进而不在最终字符串中插入空格。IE

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

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

4

2 回答 2

27

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

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

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

// "abcdefghijklmnopqrstuvwxyz"

这种方法使您的代码看起来像废话。不建议。

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

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

// "abcdefghijklmnopqrstuvwxyz"
于 2016-11-22T03:31:01.103 回答
6

为什么不使用标记模板文字函数？

function noWhiteSpace(strings, ...placeholders) {
  let withSpace = strings.reduce((result, string, i) => (result + placeholders[i - 1] + string));
  let withoutSpace = withSpace.replace(/$\n^\s*/gm, ' ');
  return withoutSpace;
}

然后你可以标记任何你想要换行的模板文字：

let myString = noWhiteSpace`This is a really long string, that needs to wrap over
    several lines. With a normal template literal you can't do that, but you can 
    use a template literal tag to allow line breaks and indents.`;

提供的函数将删除所有换行符和行前制表符和空格，产生以下内容：

> This is a really long string, that needs to wrap over several lines. With a normal template literal you can't do that, but you can use a template literal tag to allow line breaks and indents.
于 2018-08-15T15:43:58.650 回答