模板字符串是用反引号包裹、支持多行文本和${}嵌入表达式的字符串字面量;可直接换行、保留空格,${}内支持变量、运算、函数调用及三元运算,且表达式在求值时立即执行。

JavaScript的模板字符串是一种用反引号(`)包裹的字符串字面量,支持多行文本和嵌入表达式。
模板字符串的基本写法
普通字符串用单引号或双引号,而模板字符串必须用反引号。它能自然保留换行和空格,不需要转义符就能写多行内容。
-
✅ 正确:
`hello\nworld`或直接换行:`hello
world` - ❌ 普通字符串中换行需用
\n,且不能直接回车
用 ${} 嵌入表达式
在模板字符串中,用 ${expression} 的语法插入任意 JavaScript 表达式,包括变量、运算、函数调用甚至三元运算符。
- 变量:
const name = "Alice"; console.log(`Hi, ${name}`); // "Hi, Alice" - 运算:
const a = 5; const b = 3; console.log(`${a} + ${b} = ${a + b}`); // "5 + 3 = 8" - 函数调用:
console.log(`Time: ${new Date().toLocaleTimeString()}`) - 三元判断:
const age = 18; console.log(`You are ${age >= 18 ? "adult" : "minor"}.`)
注意作用域与执行时机
花括号内的表达式在模板字符串求值时立即执行,使用的是当前作用域的变量。它不是延迟求值,也不是字符串替换——而是实时计算后转为字符串拼接。
立即学习“Java免费学习笔记(深入)”;
- 若变量未定义,会报
ReferenceError,和普通代码一样 - 表达式可以是任意合法语句,但不能是语句块(如
${if(x){}}不合法),只支持表达式
与字符串拼接对比更直观
传统方式:"Hello " + name + ", you're " + (age + 1) + " next year."
模板字符串:`Hello ${name}, you're ${age + 1} next year.`
后者更易读、少出错、支持换行和逻辑嵌入,是现代 JS 字符串操作的推荐方式。










