Il metodo replace in JavaScript è utilizzato sulle stringhe per sostituire uno o più valori.
La sintassi è dunque la seguente: stringa.replace(valore, nuovoValore).
Quindi il metodo accetta due parametri obbligatori, il primo valore che rappresenta il valore da ricercare nella stringa e che verrà successivamente sostituito dal secondo parametro nuovoValore.
Esempi di utilizzo del metodo replace in JavaScript
In questo primo esempio sostituiremo una parola con un’altra.
Ecco quindi una possibile implementazione:
let frase = 'fare coding fin dalla scuola superiore';
const fraseCambiata = frase.replace('superiore','primaria');
console.log(fraseCambiata);
In questo modo, se ci sono più occorrenze verrà sostituita solo la prima che incontra. Se desideriamo sostituirle tutte possiamo utilizzare gli operatori globali.
Operatore globale g
Con il metodo replace di JavaScript si può far in modo che se ci sono più occorrenze vengano sostituite tutte utilizzando l’operatore globale g, dunque non ci si ferma solo alla prima.
Questo operatore si utilizza assieme alle espressioni regolari che hanno la seguente sintassi /pattern/modifiers. Quindi si racchiude tra / il valore da sostituire e successivamente si aggiunge il modificatore, nel nostro caso g.
Attenzione g è case-sensitive, quindi utilizzando questo modificatore non si sostituiscono le parole che non rispettano le maiuscole/minuscole.
Ecco quindi un esempio d’uso dell’operatore globale g con il metodo replace di JavaScript.
// operatore globale g
let frase = 'Fare coding fin dalla scuola superiore. Nella scuola Superiore di primo grado e la scuola superiore di secondo grado ';
const fraseCambiata = frase.replace(/superiore/g,'primaria');
console.log(fraseCambiata);
In questo caso si otterrà questo risultato: Fare coding fin dalla scuola primaria. Nella scuola Superiore di primo grado e la scuola primaria di secondo grado.
Quindi non ha sostituito Superiore in quanto ha l’iniziale maiuscola.
Operatore globale gi
Si può utilizzare l’operatore globale g con i, dove i è un modificatore in quanto modifica la ricerca in modo che non si abbia distinzione tra maiuscole e minuscole.
L’operatore globale gi è dunque case-insensitive, quindi utilizzato con il metodo replace di JavaScript consente di sostituire tutte le occorrenze indipendentemente se in maiuscolo o in minuscolo.
Ecco quindi un esempio:
let frase = 'Fare coding fin dalla scuola superiore. Nella scuola SUPERIORE di primo grado e la scuola superiore di secondo grado ';
const fraseCambiata = frase.replace(/superiore/gi,'primaria');
console.log(fraseCambiata);
In questo esempio verranno sostituiti tutti i termini ‘Superiore‘, indipendentemente da come sono scritti.
Conclusione
In questa lezione abbiamo visto dei semplicissimi esempi di utilizzo di replace in JavaScript e abbiamo accennato le espressioni regolari. Torneremo a parlare di espressioni regolari proseguendo nel tutorial JavaScript.
Alcuni link utili
Gioco indovina numero in JavaScript
Gioco della morra cinese in JavaScript
Semplice quiz utilizzando gli array
Come realizzare il gioco dei dadi online