Javascript String matchAll() Method

The JavaScript matchAll method is very useful for working with regular expressions. It allows developers to find all matches of a pattern in a string, returning an iterator with detailed match results. This method is especially useful for extracting multiple pieces of information from text efficiently. In this guide, we’ll explore how to use the matchAll method, with examples to demonstrate its practical applications in JavaScript programming.

Syntax:

string.matchAll(regex)

string is the string on which the method is called.
regex is a regular expression object defining the pattern to search for in the string.

Parameter:

Regexp: It is simply a regular expression object. The RegExp object must include the /g flag, else a TypeError is thrown.

Return value:

Returns an iterator containing the matches including the capturing groups.

JavaScript String matchAll() Examples

Example 1: Extracting Multiple Matches with JavaScript matchAll()

The code defines a function myFunction that demonstrates the usage of the matchAll() method. It creates a regular expression /e(xam)(ple(\d?))/g with capturing groups and the global flag. It applies this regex pattern to the string 'example1example2example3' using matchAll(). The resulting array contains match objects, each representing a match and its capturing groups. It prints the first three match objects from the array.

JavaScript

function myFunction() { 
  
    //Regular expression with the /g flag
    const regex = /e(xam)(ple(\d?))/g;
    //Reference string
    const str = 'example1example2example3';
    
    //Using matchAll() method
    const array = [...str.matchAll(regex)];
    
    console.log(array[0]);
    console.log(array[1]);
    console.log(array[2]);
}  
myFunction();

Output

[
  'example1',
  'xam',
  'ple1',
  '1',
  index: 0,
  input: 'example1example2example3',
  groups: undefined
]
[
  'example2',
  'xam',
  'ple2',
  '2',
  index: 8,
  input: 'example1example2example3',
  groups: undefined
]
[
  'example3',
  'xam',
  'ple3',
  '3',
  index: 16,
  input: 'example1example2example3',
  groups: undefined
]

Example 2: Case-Sensitive Match Extraction using matchAll() in JavaScript

This example uses matchAll() with a case-sensitive regex pattern to extract occurrences of “geek” from the input string, iterating over the resulting match objects to log each match.

JavaScript

function extractMatches() {
    const regex = /geek/g; // Case-sensitive regex pattern
    const str = 'Geek, geek, GEEK'; // Input string
    const matches = [...str.matchAll(regex)]; // Extracting matches
    
    for (const match of matches) {
        console.log(match[0]); // Output: 'geek'
    }
}

extractMatches();

Output

geek

Understanding the JavaScript matchAll method enhances your ability to handle complex string operations. By using this method, you can efficiently extract and process multiple matches in a string, making it a valuable addition to your JavaScript toolkit. Practice using matchAll with various patterns to fully grasp its potential and improve your coding efficiency in handling text data. This guide provides the foundation you need to start leveraging matchAll in your projects.

We have a complete list of Javascript Strings methods, to check those please go through Javascript String Complete reference article.

Supported Browser:

Tags:

#JavaScript-Methods #javascript-string #JavaScript #Web Technologies

JavaScript String match() Method

JavaScript String normalize() Method

Javascript String matchAll() Method

JavaScript String matchAll() Examples

Contact Us