Remplacer toutes les instances d'une chaîne en JavaScript

1. Utilisez la fonction JavaScript intégrée String.prototype.replaceAll() pour remplacer toutes les occurrences d’une chaîne
2. Utiliser une expression régulière avec le drapeau g pour remplacer toutes les occurrences d’une chaîne en JavaScript
3. Utilisez split() et join() pour les anciens navigateurs ou pour des raisons de compatibilité

JavaScript vous permet de remplacer toutes les occurrences d’un caractère ou d’une sous-chaîne dans une chaîne à l’aide de plusieurs méthodes.

Toutes les méthodes ne sont pas égales en termes de vitesse et d’utilisation des ressources, il est donc important de définir clairement votre cas d’utilisation avant de choisir la meilleure méthode. De plus, la meilleure solution dépend des navigateurs que vous ciblez - ou, plus exactement, des versions des navigateurs.

Par conséquent, les navigateurs plus anciens peuvent ne pas être en mesure de comprendre les fonctionnalités JavaScript nouvellement introduites. Par exemple, la méthode replaceAll est l’option la plus simple et la plus recommandée, mais elle ne fonctionnera avec aucune version d’Internet Explorer. Heureusement, il existe d’autres moyens d’obtenir le même résultat dans les anciens navigateurs, comme détaillé ci-dessous.

Utilisez la fonction JavaScript intégrée String.prototype.replaceAll() pour remplacer toutes les occurrences d’une chaîne

C’est de loin la solution la plus simple disponible en JavaScript, d’autant plus qu’elle fait partie de la bibliothèque standard. Vous n’avez pas besoin de créer votre propre fonction à partir de zéro, et cette méthode est également considérablement plus rapide que la plupart des autres implémentations.

const my_string = 'abc 123 abc 456 abc 789 abc';

console.log(my_string.replaceAll('abc', 'xyz'));

Production :

"xyz 123 xyz 456 xyz 789 xyz"

Passez la chaîne de remplacement en tant que variable avec la méthode String.prototype.replaceAll()

L’exemple ci-dessus nécessite que vous saisissiez manuellement la chaîne d’origine et le remplacement en tant qu’arguments de fonction. Si vous souhaitez passer la chaîne de remplacement en tant que variable, vous pouvez utiliser la méthode suivante à la place :

const my_string = 'abc 123 abc 456 abc 789 abc';
let rep_string = 'xyz';

console.log(my_string.replaceAll('abc', rep_string));

Production :

"xyz 123 xyz 456 xyz 789 xyz"

En fait, vous pouvez également passer les deux arguments en tant que variables. Comme vous vous en doutez, tout ce que vous avez à faire est de créer une autre variable pour stocker la sous-chaîne que vous souhaitez remplacer, puis de la transmettre comme premier argument de la méthode replaceAll.

const my_string = 'abc 123 abc 456 abc 789 abc';

let substring = 'abc';
let rep_string = 'xyz';

console.log(my_string.replaceAll(substring, rep_string));

Production :

"xyz 123 xyz 456 xyz 789 xyz"

Utiliser une expression régulière avec le drapeau g pour remplacer toutes les occurrences d’une chaîne en JavaScript

Une autre façon d’obtenir le même résultat consiste à utiliser une expression régulière avec le drapeau g et la méthode replace(). L’inconvénient d’utiliser cette méthode est qu’elle peut être plus lente, essayez donc d’éviter cela si la vitesse d’exécution est une priorité dans votre application.

Le drapeau g signifie global, et sans lui, le code lancera une TypeError si vous essayez de l’exécuter. C’est une exigence lorsque vous travaillez avec des objets d’expression régulière et la méthode replace().

const my_string = 'abc 123 abc 456 abc 789 abc';
let new_string = my_string.replace(/abc/g, 'xyz');

console.log(new_string)

Production :

"xyz 123 xyz 456 xyz 789 xyz"

Utilisez split() et join() pour les anciens navigateurs ou pour des raisons de compatibilité

Comme mentionné ci-dessus, les navigateurs plus anciens peuvent ne pas comprendre les nouvelles fonctionnalités JavaScript, comme c’est le cas avec la méthode replaceAll(). Vous pouvez obtenir les mêmes résultats dans ces cas en divisant et en joignant votre chaîne à la place.

N’oubliez pas qu’il s’agit d’une très mauvaise solution en termes d’optimisation, évitez donc d’utiliser cette méthode si votre code n’est pas censé être compatible avec des logiciels plus anciens.

const my_string = 'abc 123 abc 456 abc 789 abc';
let new_string = my_string.split('abc').join('xyz');

console.log(new_string);

Production :

"xyz 123 xyz 456 xyz 789 xyz"

Il devrait être assez évident que la solution générale consiste à utiliser split() pour la chaîne que vous souhaitez rechercher et join() pour la chaîne par laquelle vous souhaitez la remplacer. Pour rendre les choses encore plus claires, voici comment vous pouvez passer les chaînes d’origine et de remplacement en tant que variables au lieu de les coder en dur :

const my_string = 'abc 123 abc 456 abc 789 abc';

original_string = 'abc';
replacement_string = 'xyz';

let new_string = my_string.split(original_string).join(replacement_string);

console.log(new_string);

Production :

"xyz 123 xyz 456 xyz 789 xyz"