导航
×
   ❮   
HTML CSS JavaScript PHP Go ECMS

JavaScript 教程

JS 简介 JS 如何使用 JS 输出 JS 语法 JS 语句 JS 注释 JS 变量 JS 运算符 JS 条件语句 JS 循环 JS 字符串 JS 数字 JS 函数 JS 对象 JS 日期 JS 数组 JS 类型化数组 JS 集合 JS Map 映射 JS Math JS 正则表达式 JS 数据类型 JS 错误 JS 事件 JS 编程 JS 关键字参考 JS 保留关键字参考 JS 运算符参考 JS 运算符优先级 JS UTF-8 字符 JS UTF-8 符号 JS UTF-8 表情符号 JS 版本

JavaScript 模板字符串


字符串模板

模板字符串

模板字面量

心爱的孩子有很多名字

反引号语法

模板字符串 使用反引号 (``) 而不是单引号 ("") 来定义字符串:

示例

let text = `Hello World!`;

亲自试一试 »


字符串中的引号

模板字符串允许在字符串中使用单引号和双引号:

示例

let text = `He's often called "Johnny"`;

亲自试一试 »


多行字符串

模板字符串允许多行字符串:

示例

let text =
`The quick
brown fox
jumps over
the lazy dog`;

亲自试一试 »


插值

模板字符串允许在字符串中使用变量。

模板字符串提供了一种在字符串中插入变量的简便方法。

语法

${...}

示例

变量替换:

let firstName = "John";
let lastName = "Doe";

let text = `Welcome ${firstName}, ${lastName}!`;

亲自试一试 »


表达式替换

模板字符串允许在字符串中插入表达式:

示例

let price = 10;
let VAT = 0.25;

let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;

亲自试一试 »


HTML模板

示例

let header = "Template Strings";
let tags = ["template strings", "javascript", "es6"];

let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
  html += `<li>${x}</li>`;
}

html += `</ul>`;

亲自试一试 »


浏览器支持

模板字符串ES6 特性

自 2017 年 6 月起,所有现代浏览器均已完全支持 ES6。

         
Chrome
51
Edge
15
Firefox
54
Safari
10
Opera
38
2016年5月 2017年4月 2017年6月 2016年9月 2016年6月

完整的字符串参考

如需完整的字符串参考,请访问我们的:

完整的 JavaScript 字符串参考

该参考包含所有字符串属性和方法的描述和示例。


freew3c.com 中文网是独立运营的中文开发者学习平台,与 freew3c.com 无关联。提供的内容仅用于学习和测试,不保证内容的正确性。


Copyright @2020-2026 京ICP备888888号-8