Migliori risultati di corrispondenza con String.prototype.matchAll()

Joe Medley

Chrome 73 introduce il metodo String.prototype.matchAll(). Il suo comportamento è simile a quello di match(), ma restituisce un iteratore con tutte le corrispondenze dell'espressione regolare in un'espressione regolare globale o fissa. Questo offre un modo semplice per eseguire l'iterazione sulle corrispondenze, in particolare quando hai bisogno di accedere ai gruppi di acquisizione.

Cosa c'è che non va con match()?

La risposta breve è nessuna, a meno che tu non stia cercando di restituire corrispondenze globali con gruppi di acquisizione. Ecco un puzzle di programmazione per te. Considera il seguente codice:

const regex = /t(e)(st(\d?))/g;
const string = 'test1test2';
const results = string.match(regex);
console.log(results);
// → ['test1', 'test2']

Esegui questo comando in una console e noterai che restituisce un array contenente le stringhe 'test1' e 'test2'. Se rimuovo il flag g dall'espressione regolare, ottengo tutti i gruppi di cattura, ma solo la prima corrispondenza. Ha questo aspetto:

['test1', 'e', 'st1', '2', index: 0, input: 'test1test2', groups: undefined]

Questa stringa contiene una seconda possibile corrispondenza che inizia con 'test2', ma non la ho. Ora ecco il problema: come faccio a ottenere tutti i gruppi di acquisizione per ogni corrispondenza? La spiegazione della proposta String.prototype.matchAll() mostra due possibili approcci. Non te li descriverò perché spero che non ti servano più per molto tempo.

String.prototype.matchAll()

Che aspetto avranno gli esempi di spiegazione con matchAll()? Dai un'occhiata.

const regex = /t(e)(st(\d?))/g;
const string = 'test1test2';
const matches = string.matchAll(regex);
for (const match of matches) {
  console.log(match);
}

Tieni presente alcune cose. A differenza di match(), che restituisce un array in una ricerca globale, matchAll() restituisce un iteratore che funziona perfettamente con i cicli for...of. L'iteratore produce un array per ogni corrispondenza, inclusi i gruppi di cattura con alcuni extra. Se li stampi nella console, avranno il seguente aspetto:

['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', groups: undefined]
['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', groups: undefined]

Potresti notare che il valore di ogni corrispondenza è un array nello stesso formato fornito da match() per le espressioni regolari non globali.

Materiale extra

Questo articolo è rivolto principalmente a chi non ha dimestichezza con le espressioni regolari o non è un esperto in materia. Potresti aver notato che i risultati di match() e matchAll() (per ogni iterazione) sono array con alcune proprietà denominate aggiuntive. Durante la preparazione di questo articolo, ho notato che queste proprietà presentano alcune carenze nella documentazione su MDN (che ho corretto). Ecco una breve descrizione.

index

L'indice del primo risultato nella stringa originale. Nell'esempio precedente, test2 inizia dalla posizione 5, quindi index ha il valore 5.

input

La stringa completa su cui è stato eseguito matchAll(). Nel mio esempio, era 'test1test2'.

groups

Contiene i risultati di eventuali gruppi di cattura con nome specificati nell'espressione regolare.

Conclusione

Se ho dimenticato qualcosa, non esitare a farmelo sapere nei commenti qui sotto. Puoi scoprire di più sulle modifiche recenti a JavaScript negli aggiornamenti precedenti o sul sito web di V8.