Sostituire tutte le occorrenze in una stringa in JavaScript purtroppo non è immediato e in questo articolo scopriremo come fare!
Partiamo dal presupposto che esiste il metodo replace. Funziona così: sostituisce una stringa con un’altra all’interno della stringa di partenza.
Ciao mi chiamo Lorenzo Neri e sono un informatico: realizzo contenuti per aiutare le persone a padroneggiare l’arte del nuovo millennio, ovvero l’informatica!
Facciamo un esempio:
var stringa = "ciao Buongiorno sono ciao ciao ciao Lorenzo";
stringa = stringa.replace("ciao","");
Semplice no? Immediato, rapido e indolore!
No, purtroppo non funziona come ti aspetteresti.
Come funziona davvero la “replace” in JavaScript
La “replace” in JavaScript funziona in modo becero. Si limita a sostituire solo la prima occorrenza all’interno di una stringa.
Di fatto, il risultato che avremmo riprendendo l’esempio di prima sarebbe questo:
var stringa = "ciao Buongiorno sono ciao ciao ciao Lorenzo";
stringa = stringa.replace("ciao","");
console.log(stringa); => "Buongiorno sono ciao ciao ciao Lorenzo"
Quindi, non abbiamo risolto il problema purtroppo!
Abbiamo due possibilità, vediamole.
Come sostituire tutte le occorrenze in una stringa in JavaScript con “split” e “join”
Si tratta di due funzioni che permettono di raggiungere il nostro scopo.
Quello che dobbiamo fare in modo molto semplice è questo:
Dividiamo la stringa in base all’occorrenza che vogliamo eliminare, dopodiché uniamo il tutto con la stringa che andrà a sostituire le occorrenze
La andiamo a dividere in modo tale da individuare tutte le occorrenze che intendiamo rimuovere.
Una volta fatto ciò, la uniamo di nuovo usando come “collante” la stringa che andrà a sostituire le occorrenze.
Riprendiamo l’esempio di prima:
var stringa = "ciao Buongiorno sono ciao ciao ciao Lorenzo";
stringa = stringa.split("ciao").join("");
console.log(stringa)=>"Buongiorno sono Lorenzo"
Per farlo più generale:
stringa = stringa.split("occorrenzaDaSostituire").join("stringaCheSostituisce");
Ora che abbiamo visto il primo metodo per sostituire tutte le occorrenze in una stringa in JavaScript, passiamo al secondo
Sostituire tutte le occorrenze in una stringa in JavaScript con le espressioni regolari
I limiti della “replace” li abbiamo visti poco fa, ma possono essere superati. Come? Siano lodate le espressioni regolari!
Riprendiamo di nuovo l’esempio di prima:
var stringa = "ciao Buongiorno sono ciao ciao ciao Lorenzo";
stringa = stringa.replace(/ciao/g,"");
Il modificatore “g” nelle espressioni regolari, sta ad indicare “ricerca globale”, andando a individuare tutte le occorrenze dentro la stringa.
Perciò, per renderlo generale:
stringa = stringa.replace(/occorrenzaDaTrovare/g,"occorrenzaCheSostituisce");
Ora che abbiamo visto entrambi i modi per sostituire tutte le occorrenze in una stringa in JavaScript, potresti chiederti…
“Lorenzo quale dei due è meglio?”
Diciamo che in diversi casi, specialmente con stringhe lunghe, possono avere un grosso impatto nei browser dei tuoi utenti.
Ti lascio qui un link per testare l’efficacia di entrambi i metodi e capire quale sia meglio scegliere 😉