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:


var frase = 'fare coding fin dalla scuola superiore';
var 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
var frase = 'Fare coding fin dalla scuola superiore. Nella scuola Superiore di primo grado e la scuola superiore di secondo grado ';

var 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:


var frase = 'Fare coding fin dalla scuola superiore. Nella scuola SUPERIORE di primo grado e la scuola superiore di secondo grado ';
var fraseCambiata = frase.replace(/superiore/gi,'primaria');
console.log(fraseCambiata);

In questo esempio verranno sostituiti tutti i termini ‘Superiore‘, indipendentemente da come sono scritti.

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

Indice tutorial JavaScript

Utilizzare JavaScript prompt

Gioco indovina numero in JavaScript

Gioco della morra cinese in JavaScript

Semplice quiz utilizzando gli array

Come realizzare il gioco dei dadi online

Cicli for annidati