在 JavaScript 中，字符串是一种基本的数据类型，我们经常需要处理各种字符串操作，如拼接、替换、截取等。而 ES9 中引入了一种新的语法——标记模板文字（Tagged Template Literals），它可以让我们更方便地对字符串进行操作和扩展功能。
标记模板文字的基本语法
标记模板文字是一种特殊的字符串语法，它使用反引号（`）作为字符串的开始和结束标志，并在字符串前面加上一个标记函数（Tag Function）。标记函数是一个普通的 JavaScript 函数，它可以接收多个参数，其中第一个参数是一个数组，包含了字符串中所有的普通字符串和占位符，其余参数则是占位符中的表达式的值。
下面是一个标记模板文字的基本语法：
------------------ ---- ------------- ------ -----
其中，tagFunction 是一个标记函数，可以是任何合法的 JavaScript 函数名，string text 是普通字符串，${expression} 是占位符，可以是任何 JavaScript 表达式。
标记模板文字的应用
标记模板文字可以用于各种字符串操作和扩展功能，下面介绍一些常见的应用。
1. 字符串格式化
标记模板文字可以方便地实现字符串格式化，例如：
-------- --------------- ---------- -
------ ----------------------- ------- -- -- -
------ ------ - ------ - ---------- -- ----
-- ----
-
----- ---- - --------
----- --- - ---
----- --- - --------- ---- -- ------- --- - -- ------ ----- ------
----------------- -- --- ---- -- ----- --- - -- -- ----- -----上面的例子中，我们定义了一个 format 函数，它接收一个字符串数组和多个表达式的值作为参数，然后使用 reduce 方法将字符串和表达式的值拼接成一个字符串。
2. HTML 模板
标记模板文字可以方便地实现 HTML 模板，例如：
-------- ------------- ---------- -
----- ------ - ---
------------------------ -- -- -
--------------------
-- -- - -------------- -
-------------------------------
-
---
------ ----------------
-
-------- ----------- -
------ ----------------- --------
-------------- -------
-------------- -------
-------------- ---------
-------------- ---------
-
----- ---- - --------
----- --- - ---
----- ------- - ----------
-------- -----------
------- ----------
--------
--------------------- -- -------------- ---------------- -------------上面的例子中，我们定义了一个 html 函数，它接收一个字符串数组和多个表达式的值作为参数，然后将字符串和表达式的值拼接成一个 HTML 字符串，并对其中的特殊字符进行转义。
3. 多语言支持
标记模板文字可以方便地实现多语言支持，例如：
----- -------- - -
--- -
--------- ------- ---------
--
--- -
--------- -------------
-
--
-------- ------------- ---------- -
----- ---- - ----- -- ------------------
----- ------- - ---------------
------ ----------------------- ------- -- -- -
------ ------ - ------ - ------------------- -- ----
-- ----
-
----- ---- - --------
----- -------- - -------- -------- -- -------------------------
---------------------- -- ---- -------- -- ------ -------上面的例子中，我们定义了一个 i18n 函数，它接收一个字符串数组和多个表达式的值作为参数，其中表达式的值是一个字符串，表示要翻译的消息的键值。然后根据当前语言从消息中获取对应的翻译，并将字符串和翻译拼接成一个字符串。
总结
标记模板文字是一种强大的字符串语法，它可以方便地实现字符串格式化、HTML 模板、多语言支持等功能。我们可以根据具体的需求定义不同的标记函数，来扩展 JavaScript 字符串的功能。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65cfa9ffadd4f0e0ff8d7eaf