JavaScript ha un supporto nativo per le espressioni regolari basato sull'oggetto RegExp. Un'espressione regolare in JavaScript quindi è un oggetto, con delle proprietà e metodi che consentono di gestire testi, individuare ed eventualmente sostituire stringhe all'interno di altre stringhe.
Creare un'espressione regolare
Sono previsti due approcci per la creazione di un'espressione regolare: facendo riferimento esplicito all'oggetto RegExp
o utilizzando una speciale notazione letterale. Consideriamo il seguente esempio:
var x = new RegExp("abc");
var y = /abc/;
Entrambe le istruzioni ottengono lo stesso risultato: un'espressione regolare per la ricerca di istanze delle stringa "abc
" all'interno di altre stringhe.
Sintassi delle espressioni regolari
La sintassi e le funzionalità delle espressioni regolari supportate da JavaScript sono basate sul modello di quelle supportate da Perl 5. Richiamando brevemente questa sintassi, possiamo dire che una espressione regolare è uno schema di stringa (pattern
) composto da una sequenza di caratteri alfanumerici e di eventuali caratteri speciali.
Un'espressione di soli caratteri alfanumerici indica direttamente la stringa da ricercare all'interno di un'altra stringa. Ad esempio, l'espressione regolare /abc/
può essere utilizzata per ricercare o sostituire la sottostringa abc
all'interno di una stringa.
Normalmente la ricerca di pattern all'interno di una stringa avviene tenendo conto della distinzione tra maiuscole e minuscole e la ricerca o sostituzione termina non appena viene individuata un'occorrenza.
È prevista però la possibilità di modificare il comportamento predefinito tramite i seguenti modificatori:
Modificatore | Descrizione |
---|---|
i |
esegue una ricerca ignorando la distinzione tra maiuscole e minuscole |
g |
esegue una ricerca globale, cioè individua tutte le occorrenza di un pattern |
m |
esegue una ricerca su stringhe multilinea |
I modificatori vengono specificati in maniera diversa a seconda dell'approccio utilizzato per definire l'espressione regolare. Nel caso di utilizzo di un letterale i modificatori vengono specificati subito dopo il letterale stesso, mentre in caso di utilizzo dell'oggetto RegExp
essi vengono indicati come parametro aggiuntivo. I seguenti esempi mostrano l'utilizzo dei modificatori in entrambi i casi:
var x = new RegExp("abc", "i");
var y = /abc/i;
var x = new RegExp("abc", "ig");
var y = /abc/ig;
Caratteri speciali
I caratteri speciali in una espressione regolare consentono di creare pattern
che individuano non una sola stringa ma insiemi di stringhe.
Tra questi caratteri abbiamo le parentesi quadre che permettono di specificare un insieme di caratteri alfanumerici. Ad esempio, la seguente espressione regolare indica l'insieme delle stringhe che iniziano per vocale e finiscono con bc
:
var y = /[aeiou]bc/i;
Abbiamo anche la possibilità di specificare un intervallo di caratteri indicano l'elemento iniziale e quello finale, come ad esempio [a-z]
o [0-9]
.
Un'altra categoria di caratteri speciali è quella dei cosiddetti metacaratteri, cioè di caratteri che ne indicano altri. Per fare qualche esempio:
Metacarattere | Descrizione |
---|---|
. |
Il punto indica un qualsiasi carattere |
\w |
indica un carattere alfanumerico |
\d |
indica una cifra numerica |
Per evitare che w
e d
siano interpretati come i caratteri alfabetici si fa ricorso al carattere di escaping \
. Quindi all'interno di un'espressione regolare, per utilizzare i metacaratteri w
e d
utilizzeremo la sequenza \w
e \d
.
Di conseguenza la seguente espressione regolare individua le stringhe che iniziano con un numero a due cifre sono seguiti dalla stringa aa
quindi da un carattere qualsiasi e terminano con due caratteri alfanumerici:
var y = /\d\daa.\w\w/i;
Un'altra importante categoria di caratteri speciali è quella dei quantificatori, cioè di caratteri che indicano quante volte un carattere può comparire in una stringa. Vediamone alcuni:
Quantificatore | Descrizione |
---|---|
+ |
messo dopo un carattere o un metacarattere, indica che ci si aspetta l'esistenza di una o più occorrenze del carattere/metacarattere |
* |
indica l'esistenza di zero o più occorrenze |
* |
indica l'esistenza di zero o più occorrenze |
? |
indica l'esistenza di zero o una occorrenza |
{n} |
indica l'esistenza di esattamente n occorrenze |
Per esempio, la seguente espressione regolare individua nomi validi per le variabili in JavaScript, cioè sequenze di caratteri alfanumerici di lunghezza variabile che iniziano con un carattere alfabetico:
var y = /[a-z]+\w*/i;
Per fare un altro esempio concreto di espressione regolare, quella che segue individua lo schema di un codice fiscale:
var codiceFiscale = /[a-z]{6}\d{2}[abcdehlmprst]\d{2}[a-z]\d{3}[a-z]/i;
Naturalmente l'insieme dei caratteri speciali che abbiamo indicato non è completo, per cui rimandiamo ad una risorsa specifica per scoprire le potenzialità delle espressioni regolari.
Metodi e proprietà
Una volta creata l'istanza di un'espressione regolare in JavaScript possiamo sfruttarne le proprietà e i metodi. Ad esempio, le proprietà booleane global
, ignorecase
e multiline
indicano se per l'espressione corrente sono stati specificati i rispettivi modificatori.
Esaminiamo la seguente espressione:
var y = /[a-z]+\w*/ig;
le proprietà y.global
e y.ignoreCase
valgono true
, mentre y.multiline
sarà false
.
Test
Il metodo test() consente di verificare se una stringa individuata dall'espressione regolare è contenuta nella stringa passata come argomento. Ad esempio, il seguente codice consente di verificare la presenza di valori numerici all'interno di una stringa:
var y = /\d/;
y.test("str1nga"); //true
y.test("stringa"); //false
Exec
A differenza di test()
che restituisce un valore booleano, il metodo exec() restituisce un array con la sottostringa individuata o il valore null
in caso di esito negativo:
var y = /\d/;
y.exec("str1nga"); //["1"]
y.exec("stringa"); //null
È importante notare che l'esecuzione dei metodi test()
ed exec()
su un'espressione regolare con modificatore global
attivo aggiorna la proprietà lastIndex dell'oggetto RegExp
. Tale proprietà contiene l'indice all'interno della stringa da cui partire per la ricerca. Dopo l'eventuale individuazione di una sottostringa questa proprietà viene aggiornata con l'indice che punta al resto della stringa. Questo comporta che l'eventuale riesecuzione di test()
o exec()
sulla stessa espressione regolare permette di individuare eventuali successive occorrenze di sottostringhe.
Il seguente esempio mostra un caso di esecuzione successiva del metodo exec()
:
var y = /\d/g;
y.exec("str1ng4"); //["1"]
y.exec("str1ng4"); //["4"]
y.exec("str1ng4"); //null
Search, replace, split e match, ricerca e parsing delle stringhe con espressioni regolari
Alcuni metodi dell'oggetto String
accettano espressioni regolari come argomento. Questo consente di sfruttare al massimo le loro potenzialità sulle stringhe.
Ad esempio, il metodo search() dell'oggetto String
restituisce l'indice della prima occorrenza di una stringa individuata tramite l'espressione regolare passata come argomento:
var x = "str1nga".search(/\d/);
Il valore della variabile x
dopo l'esecuzione del metodo sarà 3. Nel caso in cui non venga trovata una corrispondenza il metodo search()
restituisce il valore -1.
Anche il metodo split(), che genera un array a partire da una stringa, accetta espressioni regolari come input, come mostrato dal seguente esempio:
var x = "str1nga".split(/\d/); //["str", "nga"]
Il metodo replace() consente di sostituire una o più occorrenze di una stringa individuata da un'espressione regolare con un'altra stringa. Il seguente esempio sostituisce tutte le occorrenze di un numero con la stringa "numero
":
var x = "str1ng4".replace(/\d/g, "numero"); //"strnumerongnumero"
Infine il metodo match() consente di ottenere un array con le sottostringhe individuate da un'espressione regolare:
var x = "str1ng4".match(/\d/g); //["1", "4"]
Esempi comuni di espressioni regolari
Concludiamo questa pagina sulle espressioni regolari in JavaScript facendo notare come un loro classico utilizzo è quello della validazione dell'input dell'utente. Abbiamo visto un esempio di espressione regolare che individua lo schema di un codice fiscale. Le seguenti espressioni rappresentano alcuni pattern di validazione molto comuni:
Espressione | Descrizione |
---|---|
/\w+@\w+\.\w{2,4}/i |
indirizzo di posta elettronica |
/\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/ |
indirizzo IP |
/<div\b[^>]*>(.*?)<\/div>/i |
elemento HTML <div> |
/[a-f0-9]+/i |
valori esadecimali |
(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w\.-]*)*\/? |
un URL |