模板字符串是 ECMAScript 2015(ES6)规划中新增的一种字符串表示方式。模板字符串是对普通字符串功能进行了增强，它可以像普通字符串一样使用，还有一些普通字符串之外的功能。它使用``代替普通字符串中的单引号和双引号，并支持多行字符串表示、表达式插补、标签模板等特性。
1. 模板字符串
模板字符串使用``代替普通字符串中的单引号和双引号，它有以下几种表示形式：
// 单行模板字符串
`string text`
// 多行模板字符串
`string text line 1
string text line 2`
// 带表示式的模板字符串
`string text ${expression} string text`
// 标签模板字符串
tag `string text ${expression} string text`
模板字符串允许嵌入表达式，并且支持多行字符串和字符串插补特性。模板字符中可以包含特定的占位符${expression}，占位符中的表达式和周围的文本会一起传递给一个默认函数，该函数负责将所有的部分连接起来。
如果一个模板字符串由表达式开头(如，tag)，则该字符串被称为带“标签模板字符串”。这种情况下，标签表达式(通常是一个函数)会在模板字符串处理后被调用，在输出最终结果前，你都可以在通过该函数对模板字符串来进行操作处理。
2. 模板字符串特性
2.1 多行字符串
模板字符串可以用于定义多行文本，在新行中插入的任何字符都是模板字符串中的一部分。
在普通字符串，我们会像下面这样定义多行文本：
console.log("第 1 行字符串\n"+
"第 2 行字符串");
而在模板字符串，我们可以像下面这样定义多行文本：
console.log(`第 1 行字符串 第 2 行字符串`);
2.2 表达式插补
模板字符串支持嵌入表达式。在普通字符串中嵌入表达式时，需要使用以下语法：
var a = 5;
var b = 10;
console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
// "Fifteen is 15 and
// not 20."
而在模板字符串中，我们可以用更优雅的方式来表示：
var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."
2.3 标签模板字符串
标签模字符串是模板字符串一种更高级的用法，它允许你通过标签函数修改模板字符串的输出。
标签函数中包含两个参数。第一个参数是一个包含字符串字量的数组(在本例中是"Hello"和"world")。第二个参数(第一个参数后的每个参数)，是已经被处理好的替换表达式(本例中是"15"和"50")。标签函数的返回值是已经处理好的字符串。
var a = 5;
var b = 10;
function tag(strings, ...values) {
console.log(strings[0]); // "Hello "
console.log(strings[1]); // " world "
console.log(values[0]); // 15
console.log(values[1]); // 50
return "itbilu.com";
}
tag`Hello ${ a + b } world ${ a * b}`;
// "itbilu.com"
2.4 原始字符串
在标签函数的第一个参数中存在一个特殊的属性：raw，该属性用于访问模板字符串的原始字符串。
function tag(strings, ...values) {
console.log(strings.raw[0]);
// "string text line 1 \n string text line 2"
}
tag`string text line 1 \n string text line 2`;
此外，还可以使用String.raw()方法来创建原始字符串，该方法创建与使用默认模板函数和字符串连接创建是一样的：
String.raw`Hi\n${2+3}!`;
// "Hi\\n5!"