模板字符串为构造多行字符串和字符串拼接带来了更加方便的方式。

多行字符串

之前，我们如果要构造一个多行，我们需要在字符串中自己加入换行符\n，就像这样:

var lines = "text line one\ntext line two"；//"text line one//text line two"

上面的看起来有点乱，让我们写的再好看直观一点：

var lines2 = "text line one\n"            + "text line two";

可以再怎么写，总是觉得不是很优雅美观，尤其是文本内容比较多的时候。模板字符串的出现，极大的改善了这一痛点：

var lines = `text line onetext line two`

是不是干净整洁多了？

字符串拼接

模板字符串只所以叫“模板”，当然是因为它支持内嵌表达式，借助这一特性，我们可以很容易的实现字符串拼接：

var name = "Kevin";var age = 18;//老的做法：var message = "Name: " + name + ", Age: " + age;// Name: Kevin, Age: 18//模板字符串的做法：var message2 = `Name: ${name}, Age: ${age}`;

也可以做一些简单的计算：

var num1 = 10;var num2 = 20;var result = `${num1} + ${num2} = ${num1 + num2}`;// 10 + 20 = 30

标签化模板

标签化模板(Tagged Template Literals)是一个高级特性，同一个模板字符串可以通过使用不同的标签，对模板进行进一步处理，输出不同的结果。

var name = "Kevin";morning`Hello,${name}`;  // Good morning, Kevinevening`Hello,${name}`;  // Good evening, Kevin

等一下！上面的程序是怎么回事？morning,evening做了什么？

其实，这里的morning,evening就是所谓的标签(Tag)了，它们其实就是一个函数：

function morning(strings, ...values) {  return "Good morning, " + values[0];}function evening(strings, ...values) {  return "Good evening, " + values[0];}

• 标签函数的第一个参数是一个数组，它包含的值是模板字符串中除去表达式的那些部分：

var name = "Kevin";var age = 18;//比如我们有如下模板字符串var template = `Name: ${name}, Age: ${age}`;//则在标签函数中的第一个参数strings就为：//strings为 ["Name: ", ", Age: ", ""]

• 标签函数的第二个参数是个可变参数，它包含了填充模板字符串的那些表达式的值，就按上面的代码例子，那我们的values参数值就为：

// values为 ["Kevin", 18]