模板字面量使用反引号包围，通过${}插入变量或表达式，支持多行文本和嵌套，提升字符串处理的可读性与灵活性。
在 JavaScript 中，字符串插值曾经需要拼接字符串和变量，代码容易变得冗长且难读。ES6 引入了模板字面量（Template Literals），让字符串插值变得更简洁、直观。
什么是模板字面量？
模板字面量使用反引号（`）包围字符串，允许嵌入变量或表达式。它支持多行文本和动态内容插入，是处理复杂字符串的有效方式。
基本语法：
`Hello, ${expression}`
如何进行字符串插值
使用 ${} 将变量或表达式插入字符串中。
立即学习“Java免费学习笔记（深入）”；
示例：
const name = "Alice";
const age = 30;
const greeting = `Hello, my name is ${name} and I am ${age} years old.`;
console.log(greeting);
// 输出: Hello, my name is Alice and I am 30 years old.
你可以在 ${} 中放入任意 JavaScript 表达式：
- 数学运算： `The sum is ${5 + 3}`
- 函数调用： `Uppercase: ${name.toUpperCase()}`
- 三元表达式： `${age >= 18 ? 'adult' : 'minor'}`
支持多行字符串
传统字符串不能直接换行，而模板字面量天然支持多行文本。
示例：
const message = ` This is a multi-line string. `; console.log(message);
输出会保留换行和空格格式，适合生成 HTML 或格式化日志信息。
实用技巧与注意事项
模板字面量非常灵活，但也有一些细节需要注意：
- 嵌套模板： 可在 ${} 中再使用模板字面量：`Result: ${`nested ${value}`}`
- 避免注入风险： 模板字面量不会自动转义 HTML，若用于 DOM 渲染需手动处理用户输入
- 标签模板： 高级用法，通过前缀函数定制解析逻辑，如 styled.div`color: red;`
基本上就这些。模板字面量让字符串操作更自然，推荐在现代 JavaScript 开发中优先使用。
