标记模板是 JavaScript 中模板字面量的一个高级版本。你可以定义一个函数来格式化字符串，并将其与模板字面量结合使用以根据函数的功能格式化字符串。
标记模板可以与字符串一起使用，只需函数名即可，在使用函数时不需要添加括号。
语法
下面是使用 JavaScript 中标记模板的语法：
function format(str, exp1, exp2, ...expN) {
}
let res = format`${exp1} abcd ${exp2}`;
在此语法中，format() 函数作为模板标签工作。该函数接受多个参数，这些参数可以在函数体内部使用以格式化字符串。
参数
-
-
exp1, exp2, ...expN - 它们是模板字面量的表达式。
示例
示例：基本的标记模板
在下面的例子中，我们定义了 format() 函数。format() 函数将字符串数组作为参数。
函数体将 str 数组的所有元素连接起来，使用 toUpperCase() 方法将字符串转换成大写，并返回更新后的字符串。
在输出中，你可以看到模板标记已将字符串转换成了大写形式。
<html>
<body>
<p id="output"> </p>
<script>
function format(str) {
return str.join("").toUpperCase();
}
let res = format`Hi How are you?`;
document.getElementById("output").innerHTML = res;
</script>
</body>
</html>
输出：
HI HOW ARE YOU?
示例：带有表达式的标记模板
在下面的例子中，format() 函数将字符串数组和变量 name 作为参数。我们在函数体中连接所有的字符串实例，并在末尾追加 name。之后，返回更新后的字符串。
在输出中，你可以看到字符串末尾有 name。
<html>
<body>
<p id="output"> </p>
<script>
function format(str, name) {
return str.join(" ") + name;
}
let name = "John";
let res = format`Hi ${name}, How are you?`;
document.getElementById("output").innerHTML = res;
</script>
</body>
</html>
输出：
Hi , How are you?John
示例：使用剩余参数（Rest Parameter）
你也可以使用扩展运算符（参数）来收集所有表达式到单个函数参数中。否则，你需要为字符串中使用的每个表达式单独传递参数。
在下面的例子中，我们使用扩展运算符传递两个参数 name 和 price。在输出中你可以注意到参数（实参）的值被显示出来。
<html>
<body>
<div id="output1"> </div>
<div id="output2"> </div>
<script>
function format(str, ...values) {
document.getElementById("output1").innerHTML = values;
return str.join(" ") + values[1];
}
const price = 100;
let name = "John";
const res = format`Hi,${name} The price is ${price}`;
document.getElementById("output2").innerHTML = res;
</script>
</body>
</html>
输出：
John,100
Hi, The price is 100