ES6 中的模板字面量

在ES6中，模板字面量是一种新的字符串语法，用于更方便地创建字符串，同时支持插值和多行字符串。它是用反引号（`）包围的字符串，其中包含了模板内容。在模板字面量中，可以嵌入表达式或变量，并使用${}语法进行引用。

代码示例：

const name = "Alice";
const age = 30;

const message = `My name is ${name} and I am ${age} years old.`;

console.log(message);

输出结果为：

My name is Alice and I am 30 years old.

在上面的代码中，我们使用了模板字面量创建了一个包含变量和字符串的消息。${}语法可以用来引用变量或表达式，在这个例子中，我们使用${name}和${age}引用了两个变量。

除了支持插值外，模板字面量还支持多行字符串。在传统的字符串中，如果需要创建多行字符串，需要使用转义符或者字符串拼接。而在模板字面量中，可以直接在反引号内包含换行符，这样就可以轻松地创建多行字符串。

代码示例：

const message = `This is a
multi-line
message.`;

console.log(message);

输出结果为：

This is a
multi-line
message.

除了基本的插值和多行字符串外，模板字面量还支持标签函数。标签函数可以用来自定义模板字面量的行为，可以对插值进行处理并返回结果字符串。

代码示例：

function myTag(strings, ...values) {
  let result = "";
  
  // 处理字符串和插值
  for(let i = 0; i < strings.length; i++) {
    result += strings[i];
    
    if(i < values.length) {
      result += values[i];
    }
  }
  
  return result.toUpperCase();
}

const message = myTag`My name is ${name} and I am ${age} years old.`;

console.log(message);

在上面的代码中，我们定义了一个标签函数myTag。这个函数接收两个参数：一个字符串数组strings和一个扩展运算符参数...values。strings数组包含模板字面量中的所有字符串，values则包含所有的插值。

在函数中，我们遍历了strings数组和values数组，将它们拼接到一起。最后，我们将结果字符串转换成大写并返回。

运行这段代码会输出以下结果：

MY NAME IS ALICE AND I AM 30 YEARS OLD.

总结一下，ES6中的模板字面量是一种更方便、灵活、强大的字符串语法。它可以让我们更容易地创建包含变量和表达式的字符串，同时也支持多行字符串和标签函数。