JavaScript模板字面量用反引号定义，支持${变量}插入变量、表达式、跨行、对象属性访问及可选链；需避免单双引号误用、未声明变量、null/undefined未处理及IE兼容性问题。
JavaScript 中用反引号（`）包裹字符串，再在其中用 ${变量名} 插入变量值，就能实现模板字面量拼接。
基础写法：用 ${} 插入变量
模板字面量用反引号定义，变量或表达式放在 ${} 里，JS 会自动计算并转为字符串拼接进去。
- 变量直接写：如
let name = "小明"; console.log(`你好，${name}`);→ 输出“你好，小明” - 支持表达式：如
let a = 3; console.log(`结果是 ${a * 2}`);→ 输出“结果是 6” - 可跨行书写：反引号内换行会被保留，不需要
\n
嵌套对象和属性访问
可以在 ${} 中访问对象属性、调用方法，甚至链式取值。
let user = { name: "李华", age: 25 }; console.log(`用户：${user.name}，年龄：${user.age}`);-
console.log(`大写名：${user.name.toUpperCase()}`);→ “大写名：LIHUA” - 支持可选链（ES2020+）：
${user?.profile?.city || "未知"}
避免常见错误
模板字面量不是万能的，注意几个易错点：
立即学习“Java免费学习笔记（深入）”；
- 别用单引号或双引号代替反引号——那样
${}不会被解析，只是普通文本 -
${}里不能有未声明变量，否则报ReferenceError - 如果变量是
null或undefined，会原样转成字符串"null"或"undefined"，必要时先做判断或默认值处理 - 不支持旧版 IE，需确认运行环境兼容性（IE 完全不支持）
结合条件与逻辑更灵活
在 ${} 中可以写三元运算符、逻辑表达式，让拼接更动态。
let score = 85; console.log(`成绩：${score >= 60 ? "及格" : "不及格"}`);let isAdmin = true; console.log(`权限：${isAdmin && "管理员"} ${!isAdmin && "普通用户"}`);- 复杂逻辑建议抽成函数，保持模板清晰：
${getStatusLabel(status)}
