一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

JavaScript 中 String 类型的模板字符串特性

时间:2026-07-14 11:01:52 编辑:袖梨 来源:一聚教程网

模板字符串是String字面量的新语法,仍属原始string类型,用反引号定义,支持插值、多行、嵌套及标签函数,typeof返回"string",所有字符串方法均可直接调用。

javascript 中的模板字符串不是 string 类型的新子类,而是 string 字面量的一种新语法形式——它仍属于原始 string 类型,但提供了更强大的表达能力。它的核心价值在于用更自然的方式构建动态字符串,而不是改变类型本质。

用反引号定义,本质仍是字符串

模板字符串由一对反引号 ` 包裹,例如 `hello ${name}`。运行时它会被求值为标准的原始字符串(primitive string),typeof 返回 "string",和 'hello'"world" 完全一致。它不创建新对象,也不继承额外方法。

  • 不是构造函数,不能用 new String()String.raw 直接生成模板字符串
  • 所有字符串方法(如 .split().includes())都可直接调用
  • 自动装箱行为与普通字符串完全相同:临时包装成 String 对象后调用方法

支持插值,${} 里只能放表达式

模板字符串允许在 ${...} 中嵌入任意合法 JavaScript 表达式,执行结果会自动转为字符串并拼接进去。

  • 变量:${userName}
  • 运算:${price * taxRate}
  • 函数调用:${getFormattedDate()}
  • 三元判断:${isActive ? 'online' : 'offline'}
  • 可选链与空值合并:${user?.profile?.name ?? 'Guest'}
  • 不能写语句(如 ifforlet),也不能写函数声明

天然支持多行,保留空白与缩进

换行符、制表符、空格都会被原样保留在最终字符串中,无需 n+ 拼接。

  • 适合生成 HTML、CSS、SQL 等结构化文本
  • 缩进会影响输出内容,注意缩进层级是否符合预期
  • 若需去除首尾换行或缩进,可用 String#trim() 或标签函数处理

可嵌套,也支持标签函数扩展

一个模板字符串内部可以包含另一个模板字符串,实现逻辑分层;还可配合自定义标签函数,对插值前的原始字符串和值进行预处理。

立即学习“Java免费学习笔记(深入)”;

  • 嵌套示例:`Price: ${`$${(base * 1.1).toFixed(2)}`}`
  • 标签函数示例:safeHTML`<div>${userInput}</div>`(需自行实现转义)
  • 常见标签函数包括 String.raw(禁用转义)、String.fromCodePoint 不适用,但可用于国际化、SQL 参数化等场景

热门栏目