在 ES7 中，RegExp 对象的实例的原型上添加了一个新的方法：@@split。这个方法使得我们在使用正则表达式进行字符串的分割时变得更加方便。在本文中，我们将会详细介绍这个方法的使用方法和实际应用场景。
基础知识：String.prototype.split 方法
为了更好的理解 @@split 方法，我们需要先了解一下 String 对象上的 split 方法。split 方法可以将一个字符串分割成一个字符串数组，通过指定一个分隔符来实现。例如下面的例子：
let str = 'a,b,c,d';
let arr = str.split(',');
console.log(arr); // ["a", "b", "c", "d"]在这个例子中，我们通过逗号分隔符分割了一个字符串，生成了一个数组。
Regexp.prototype [@@split] 方法
跟 String.prototype.split 方法不同，RegExp.prototype[@@split] 方法不仅仅可以使用字符串分隔符，还可以使用正则表达式作为分隔符。这是因为正则表达式能够提供更加复杂和高级的匹配规则。
使用 @@split 方法的语法非常简单，我们只需要创建一个 RegExp 实例，然后调用它的方法。例如下面的例子：
let re = /\d+/; let str = '123 abc 456 def'; let arr = str[@@split](re); console.log(arr); // ["", " abc ", " def"]
在这个例子中，我们使用 /\d+/ 的正则表达式作为分隔符，将字符串分割成了一个数组。
我们可以看到，这个方法生成的数组与使用字符串作为分隔符的 split 方法不同，这个方法会将分隔符的前后两段字符串都存入到数组中。另外，如果正则表达式使用了捕获组，那么捕获的结果也会存储在数组中。例如：
let re = /(\d+)(\w+)/; let str = '123abc456def'; let arr = str[@@split](re); console.log(arr); // ["", "123", "abc", "", "456", "def"]
在这个例子中，我们使用了带有两个捕获组的正则表达式，生成的数组中除了空字符串之外，还有三个捕获组的结果。
实际应用场景
使用 RegExp.prototype[@@split] 方法，我们可以更好的处理字符串。例如，我们可以将一个字符串中的多个空格替换成单个空格：
let re = /\s+/;
let str = 'hello world !';
let arr = str[@@split](re);
let result = arr.filter(item => item !== '').join(' ');
console.log(result); // "hello world !"在这个例子中，我们使用了 /\s+/ 的正则表达式作为分隔符分割了字符串，过滤掉了数组中的空字符串，然后用 join 方法将数组拼接成了一个字符串。最终得到了单个空格的结果。
另一个实际应用场景是：将一个字符串中的大写字母转换成小写字母，并以空格分割输出。
let re = /([A-Z])/g;
let str = 'HelloWorld';
let arr = str[@@split](re);
let result = arr.map(item => item.toLowerCase()).join(' ');
console.log(result); // "hello world"在这个例子中，我们使用了 /([A-Z])/g 的正则表达式作为分隔符，匹配到了大写字母。然后我们将匹配到的大写字母转换成了小写字母，并用 join 方法将数组拼接成了一个字符串。
总结
通过 ES7 中新添加的 RegExp.prototype[@@split] 方法，我们可以更加方便地处理字符串中的内容。同时，正则表达式也提供了更加丰富和复杂的匹配规则，可以让我们更加灵活的处理字符串。因此，在实际应用中，我们可以结合正则表达式和该方法来实现更有意义和高效的字符串处理方式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64cdaf801519ea946c17dfaf