在 ES10 中，新增了一个字符串方法 matchAll，该方法返回一个迭代器，可以用于查找字符串中所有匹配正则表达式的结果。
本文将介绍 matchAll 方法的使用示例、注意事项以及一些实际应用场景。
使用示例
使用 matchAll 方法可以查找字符串中所有匹配正则表达式的结果。下面是一个简单的示例：
const str = 'hello world';
const regex = /\w+/g;
for (const match of str.matchAll(regex)) {
console.log(match[0]);
}输出结果为：
hello world
在上面的代码中，我们首先定义了一个字符串 str 和一个正则表达式 regex，然后使用 matchAll 方法查找字符串中所有匹配正则表达式的结果，并使用 for...of 循环遍历所有匹配结果并输出。
注意，matchAll 方法返回的是一个迭代器，如果需要得到所有匹配结果的数组，可以使用 Array.from 方法将迭代器转换为数组：
const str = 'hello world'; const regex = /\w+/g; const matches = Array.from(str.matchAll(regex), match => match[0]); console.log(matches);
输出结果为：
["hello", "world"]
在上面的代码中，我们使用 Array.from 方法将 matchAll 方法返回的迭代器转换为数组，并使用回调函数将匹配结果转换为字符串数组。
注意事项
使用 matchAll 方法需要注意以下几点：
matchAll方法返回的是一个迭代器，需要使用for...of或者Array.from方法来遍历所有匹配结果。matchAll方法返回的迭代器是惰性求值的，只有在遍历时才会计算匹配结果。matchAll方法返回的匹配结果包含了匹配的子串、匹配的位置、输入字符串等信息，需要根据实际需求来选择需要的信息。
实际应用场景
matchAll 方法可以用于查找字符串中所有匹配正则表达式的结果，可以应用于很多实际场景中。下面是一些使用 matchAll 方法的实际应用场景：
- 统计字符串中单词出现次数
// www.javascriptcn.com code example
const str = 'hello world hello';
const regex = /\w+/g;
const wordCount = new Map();
for (const match of str.matchAll(regex)) {
const word = match[0];
const count = wordCount.get(word) || 0;
wordCount.set(word, count + 1);
}
console.log(wordCount);输出结果为：
Map(2) {"hello" => 2, "world" => 1}在上面的代码中，我们使用 matchAll 方法和 Map 对象统计了字符串中每个单词出现的次数。
- 生成 URL 查询参数字符串
const params = { foo: 'bar', baz: 'qux' };
const queryString = Object.entries(params)
.map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
.join('&');
console.log(queryString);输出结果为：
foo=bar&baz=qux
在上面的代码中，我们使用 Object.entries 方法将参数对象转换为键值对数组，然后使用 Array.map 方法将键值对数组转换为 URL 查询参数字符串，并使用 Array.join 方法将字符串数组合并为一个字符串。
总结
matchAll 方法是 ES10 中新增的字符串方法，可以用于查找字符串中所有匹配正则表达式的结果。使用 matchAll 方法需要注意迭代器的惰性求值和匹配结果的信息，可以应用于很多实际场景中，如统计字符串中单词出现次数和生成 URL 查询参数字符串等。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/65c86e32add4f0e0ff240d1c