ECMAScript 新特性：模板字符串详解

Hi，我是布兰妮甜 ！模板字符串（Template Literals）是 ECMAScript 6 (ES6) 引入的一项强大特性，它彻底改变了 JavaScript 中字符串的处理方式。本文将深入探讨模板字符串的语法、优势、应用场景以及一些高级用法。

---

---

一、基本语法

模板字符串使用反引号 (``) 包裹，与普通字符串的单引号或双引号不同。例如：

const name = 'World';
const greeting = `Hello, ${
     name}!`;
console.log(greeting); // 输出: Hello, World!

二、优势特性

1. 变量嵌入：模板字符串最显著的特点就是可以使用 ${} 语法嵌入变量或表达式，代码更加简洁直观。

const name = 'Alice';
const age = 25;
const message = `My name is ${
     name} and I am ${
     age} years old.`;
console.log(message); // 输出: My name is Alice and I am 25 years old.

2. 多行字符串：模板字符串可以直接换行，无需使用加号拼接或换行符 (\n)，方便书写 HTML 模板、SQL 语句等多行文本。

const html = `
  <div class="container">
    <h1>Hello, World!</h1>
    <p>This is a paragraph.</p>
  </div>
`;
console.log(html);

3. 表达式计算：${} 内不仅可以放置变量，还可以放置任何有效的 JavaScript 表达式，例如函数调用、算术运算等。

const price = 10;
const quantity = 2