正则表达式在前端开发中是非常重要的一部分，用来匹配和替换字符是其中比较常见的使用方法。在 ES9 中，对于字符串的首尾字符替换提供了新的方法，本文将详细介绍。
传统的字符串替换方法
在 ES9 之前，要替换字符串的首尾字符，一般采用以下方法：
const str = 'Hello World!'; const newStr = str.replace(/^H|!$/g, ''); console.log(newStr); // 'ello World'
这里使用了 replace() 方法，传入的第一个参数是正则表达式，表示匹配字符串的首字符和尾字符，使用 | 符号连接起来表示或的关系。第二个参数是要替换的字符，这里传入了空字符串，表示删除匹配到的字符。
这种方法虽然简单，但是存在一些问题：
- 正则表达式书写过于复杂，不利于代码的阅读和维护；
- 替换的字符只能是固定的，无法灵活处理。
因此，在 ES9 中，提供了新的方法来解决这些问题。
ES9 中的字符串替换方法
在 ES9 中，引入了 matchAll() 方法，这个方法可以将一个字符串中匹配到的所有内容（包括多个分组）以及它们的相关信息都放在一个迭代器（Iterator）中，我们可以在迭代器中使用正则表达式来修改匹配到的字串，最后再将修改后的结果进行字符串拼接或替换。
以下是使用 matchAll() 的例子：
-- -------------------- ---- ------- ----- --- - ------ -------- ----- --- - --------- --- ------ - --- --- ------ ---- -- ------------------ - ------ -- ---------- --- - - --------------------- - ---------------------- - -------------------- -- ------ ------
这里首先定义了一个正则表达式 reg，它表示匹配字符串的首字符和尾字符，使用了点号通配符以及分组符号 () 来进行分组。然后使用 matchAll() 方法，将 reg 应用在 str 上，得到一个迭代器。迭代器中的 item 对象提供了 index 和 [0] 两个属性，分别表示匹配到的字符串在原字符串中的下标和匹配到的完整字符串。通过判断 index 是否为 0，可以确定是替换首字符还是尾字符。这里将首字符转成小写，尾字符转成大写，最后将它们拼接成新的字符串。
这种方法相较于传统方法优点在于：
- 正则表达式的书写更加简单，通过迭代器可以直接获取到每一个匹配到的字符串；
- 可以在迭代器中自由修改匹配到的字符串，灵活度更高。
总结
ES9 中的 matchAll() 方法提供了更加灵活和方便的字符串替换方式，可以让我们更加便捷地处理字符串的操作。虽然这种方法需要配合正则表达式一起使用，但是正则表达式的灵活性也是它独具的优点，它可以在前端开发中扮演很多关键角色，是我们非常需要掌握的技能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64cf7236b5eee0b5256be249