模板字面量的主要功能

• 多行字符串：一个正式的多行字符串的概念
• 基本的字符串格式化：将变量的值嵌入字符串的能力
• HTML转义 向HTML插入经过安全转换后的字符串的能力

基础语法

let message = `Hello world`;

• 模板字面量可以使用反斜杠(/),在模板字面量中不需要转义单,双引号

• 模板字面量可以很简洁的使用多行字符串

let message = `Hello
world`

• 在模板字面量中，可以把任何合法的javascript表达式嵌入到占位符中并将其作为字符串的一部分输出到结果中。
  占位符有一个左侧的${和右侧的}符号组成，中间可以包含任意的javascript表达式

let name = 'Nicholas',
    message = `Hello ${name}` 

注意事项

• 模板字面量可以访问作用域中所有可访问的变量，而嵌入未定义的变量会抛出错误

• 可以在模板字面量中嵌入另外一个

let name = 'Nicholas',
    message = 'Hello, ${
        `my name is ${name}`
    }.`;

标签模板

• 标签模板是在模板字面量第一个反撇号(`)前方标注的字符串

let message = tag`Hello world`

• 标签是一个函数，第一个参数是一个数组，包含JavaScript解释过后的字面量字符串，它之后的所有参数都是每一个站位符的解释值

function tag(literals,...substitutions) {

}

    let a = 5,b = 10;
    let tag = (s,v1,v2)=>{
        console.log(s);
        console.log(v1);
        console.log(v2);
    }
    tag`Hello ${a+b} world ${a*b}`;  //['Hello ',' world ','']
                                     //15
                                     //50

• 通过String.raw()标签可以访问到字符转义被转换成等价字符前的原声字符串

let message1 = `Multiline\nstring`;
let message2 = String.raw`Multiline\nstring`;
console.log(message1); //'Multiline
                       //string'
console.log(message2); //'Multiline\nstring'