web-dev-qa-db-fra.com

Comment puis-je effectuer une str_replace en JavaScript, en remplaçant le texte en JavaScript?

Je souhaite utiliser str_replace ou son alternative similaire pour remplacer du texte en JavaScript.

var text = "this is some sample text that i want to replace";
var new_text = replace_in_javascript("want", "dont want", text);
document.write("new_text");

devrait donner 

this is some sample text that i dont want to replace

Si vous envisagez d'exprimer une expression régulière, quelles sont les implications pour les performances de. comparaison avec les méthodes de remplacement intégrées.

130
Vish

L'utilisation de regex pour le remplacement de chaîne est nettement plus lente que l'utilisation d'un remplacement de chaîne.
Comme démontré sur JSPerf , vous pouvez avoir différents niveaux d’efficacité pour créer une regex, mais ils sont tous beaucoup plus lents qu’un simple remplacement de chaîne. La regex est plus lente car :

Les correspondances de chaînes fixes ne comportent pas de retour en arrière, d'étapes de compilation, de plages, de classes de caractères ni d'autres hôtes qui ralentissent le moteur des expressions régulières. Il existe certainement des moyens d'optimiser les correspondances regex, mais je pense qu'il est peu probable de battre l'indexation dans une chaîne dans le cas habituel.

Pour un test simple sur la page des performances JS, j'ai documenté certains des résultats:

<script>
// Setup
  var startString = "xxxxxxxxxabcxxxxxxabcxx";
  var endStringRegEx = undefined;
  var endStringString = undefined;
  var endStringRegExNewStr = undefined;
  var endStringRegExNew = undefined;
  var endStringStoredRegEx = undefined;      
  var re = new RegExp("abc", "g");
</script>

<script>
// Tests
  endStringRegEx = startString.replace(/abc/g, "def") // Regex
  endStringString = startString.replace("abc", "def", "g") // String
  endStringRegExNewStr = startString.replace(new RegExp("abc", "g"), "def"); // New Regex String
  endStringRegExNew = startString.replace(new RegExp(/abc/g), "def"); // New Regexp
  endStringStoredRegEx = startString.replace(re, "def") // saved regex
</script>

Les résultats pour Chrome 68 sont les suivants:

String replace:    9,936,093 operations/sec
Saved regex:       5,725,506 operations/sec
Regex:             5,529,504 operations/sec
New Regex String:  3,571,180 operations/sec
New Regex:         3,224,919 operations/sec

Par souci d’intégralité de cette réponse (empruntée aux commentaires), il convient de mentionner que .replace ne remplace que la première instance du caractère recherché. Il est uniquement possible de remplacer toutes les instances par //g. Le compromis entre performances et élégance du code pourrait être considéré comme pire si le remplacement de plusieurs instances name.replace(' ', '_').replace(' ', '_').replace(' ', '_'); ou pire while (name.includes(' ')) { name = name.replace(' ', '_') }

9
TheChetan

Vous utiliseriez la méthode replace:

text = text.replace('old', 'new');

Le premier argument est ce que vous recherchez, évidemment. Il peut également accepter des expressions régulières.

Rappelez-vous simplement que cela ne change pas la chaîne d'origine. Il ne retourne que la nouvelle valeur.

194
sdleihssirhc

Plus simplement: 

city_name=city_name.replace(/ /gi,'_');

Remplace tous les espaces avec '_'!

82
realmag777

Toutes ces méthodes ne modifient pas la valeur d'origine, renvoie de nouvelles chaînes.

var city_name = 'Some text with spaces';

Remplace 1er espace par _

city_name.replace(' ', '_'); // Returns: Some_text with spaces

Remplace tous les espaces par _ avec regex. Si vous devez utiliser regex, je vous recommande de le tester avec https://regex101.com/

city_name.replace(/ /gi,'_');  // Returns: Some_text_with_spaces 

Remplace tous les espaces par _ sans expression rationnelle. Manière fonctionnelle.

city_name.split(' ').join('_');  // Returns: Some_text_with_spaces
17
Lukas

Vous devriez écrire quelque chose comme ça:

var text = "this is some sample text that i want to replace";
var new_text = text.replace("want", "dont want");
document.write(new_text);
16
Timon. Z

cette fonction remplace une seule occurrence .. si vous devez remplacer Plusieurs fois, vous devriez essayer cette fonction: http://phpjs.org/functions/str_replace:527

Pas nécessairement . Voir la réponse de Hans Kesting:

city_name = city_name.replace(/ /gi,'_');
14
Pavel

Le code que d'autres vous donnent ne remplace qu'une occurrence, alors que l'utilisation d'expressions régulières les remplace toutes (comme @sorgit). Pour remplacer tous les "veulent" par "pas vouloir", utilisez ce code:

var text = "this is some sample text that i want to replace";
var new_text = text.replace(/want/g, "dont want");
document.write(new_text);

La variable "new_text" donnera "ceci est un exemple de texte que je ne veux pas remplacer".

Pour obtenir un guide rapide sur les expressions régulières, allez ici:
http://www.cheatography.com/davechild/cheat-sheets/regular-expressions/
Pour en savoir plus sur str.replace(), allez ici:
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String/replace
Bonne chance!

14
Zoyt

hm .. Avez-vous coché replace ()?

Votre code ressemblera à ceci

var text = "this is some sample text that i want to replace";
var new_text = text.replace("want", "dont want");
document.write(new_text);
8
arbithero
var new_text = text.replace("want", "dont want");
7
Town

En JavaScript, vous appelez la méthode replace sur l'objet String, par exemple. "this is some sample text that i want to replace".replace("want", "dont want"), qui retournera la chaîne remplacée.

var text = "this is some sample text that i want to replace";
var new_text = text.replace("want", "dont want"); // new_text now stores the replaced string, leaving the original untouched
7
user193476

JavaScript a la méthode replace() de l'objet String pour remplacer les sous-chaînes. Cette méthode peut avoir deux arguments. Le premier argument peut être une chaîne ou un modèle d'expression régulière (objet regExp) et le second argument peut être une chaîne ou une fonction. Un exemple de méthode replace() ayant les deux arguments de chaîne est présenté ci-dessous.

var text = 'one, two, three, one, five, one';
var new_text = text.replace('one', 'ten');
console.log(new_text)  //ten, two, three, one, five, one

Notez que si le premier argument est la chaîne, seule la première occurrence de la sous-chaîne est remplacée comme dans l'exemple ci-dessus. Pour remplacer toutes les occurrences de la sous-chaîne, vous devez fournir une expression régulière avec un indicateur g (global). Si vous ne fournissez pas l'indicateur global, seule la première occurrence de la sous-chaîne sera remplacée même si vous fournissez l'expression régulière comme premier argument. Remplaçons donc toutes les occurrences de one dans l'exemple ci-dessus. 

var text = 'one, two, three, one, five, one';
var new_text = text.replace(/one/g, 'ten');
console.log(new_text)  //ten, two, three, ten, five, ten

Notez que vous n'emballez pas le modèle d'expression régulière entre guillemets, ce qui en fera une chaîne et non un objet regExp. Pour effectuer un remplacement insensible à la casse, vous devez fournir un indicateur supplémentaire i qui rend le modèle insensible à la casse. Dans ce cas, l'expression régulière ci-dessus sera /one/gi. Notez le drapeau i ajouté ici.

Si le second argument a une fonction et s'il y a une correspondance, la fonction est passée avec trois arguments. Les arguments obtenus par la fonction sont la correspondance, la position de la correspondance et le texte d'origine. Vous devez retourner ce que ce match doit être remplacé par. Par exemple,

var text = 'one, two, three, one, five, one';
var new_text = text.replace(/one/g, function(match, pos, text){
return 'ten';
});
console.log(new_text) //ten, two, three, ten, five, ten

Vous pouvez avoir plus de contrôle sur le texte de remplacement en utilisant une fonction comme second argument.

6
Saral

Si vous voulez vraiment un équivalent du str_replace de PHP, vous pouvez utiliser Locutus . La version PHP de str_replace supporte plus d'options que ce que JavaScript String.prototype.replace supporte . Par exemple, les balises:

//PHP
$bodytag = str_replace("%body%", "black", "<body text='%body%'>");
//JS with Locutus
var $bodytag = str_replace(['{body}', 'black', '<body text='{body}'>')  

ou de tableau

//PHP
$vowels = array("a", "e", "i", "o", "u", "A", "E", "I", "O", "U");
$onlyconsonants = str_replace($vowels, "", "Hello World of PHP");
//JS with Locutus
var $vowels = ["a", "e", "i", "o", "u", "A", "E", "I", "O", "U"];
var $onlyconsonants = str_replace($vowels, "", "Hello World of PHP");

De plus, cela n'utilise pas regex mais plutôt des boucles for. Si vous ne voulez pas utiliser regex mais souhaitez remplacer une chaîne simple, vous pouvez utiliser quelque chose comme ceci (basé sur Locutus) 

function str_replace (search, replace, subject) {

  var i = 0
  var j = 0
  var temp = ''
  var repl = ''
  var sl = 0
  var fl = 0
  var f = [].concat(search)
  var r = [].concat(replace)
  var s = subject
  s = [].concat(s)

  for (i = 0, sl = s.length; i < sl; i++) {
    if (s[i] === '') {
      continue
    }
    for (j = 0, fl = f.length; j < fl; j++) {
      temp = s[i] + ''
      repl = r[0]
      s[i] = (temp).split(f[j]).join(repl)
      if (typeof countObj !== 'undefined') {
        countObj.value += ((temp.split(f[j])).length - 1)
      }
    }
  }
  return s[0]
}
var text = "this is some sample text that i want to replace";

var new_text = str_replace ("want", "dont want", text)
document.write(new_text)

pour plus d'informations, voir le code source https://github.com/kvz/locutus/blob/master/src/php/strings/str_replace.js

3
Victor Perez

Il existe déjà plusieurs réponses utilisant str.replace () (ce qui est assez juste pour cette question) et regex mais vous pouvez utiliser la combinaison de str.split () et join () together qui est plus rapide que str.replace() et regex.

Voici un exemple de travail:

var text = "this is some sample text that i want to replace";

console.log(text.split("want").join("dont want"));

3
VicJordan

Vous avez les options suivantes:

  1. Remplacer la première occurrence

var text = "this is some sample text that i want to replace and this i WANT to replace as well.";
var new_text = text.replace('want', 'dont want');
// new_text is "this is some sample text that i dont want to replace and this i WANT to replace as well"
console.log(new_text)

  1. Remplacer toutes les occurrences - sensible à la casse

var text = "this is some sample text that i want to replace and this i WANT to replace as well.";
var new_text = text.replace(/want/g, 'dont want');
// new_text is "this is some sample text that i dont want to replace and this i WANT to replace as well
console.log(new_text)

  1. Remplacer toutes les occurrences - insensible à la casse 

var text = "this is some sample text that i want to replace and this i WANT to replace as well.";
var new_text = text.replace(/want/gi, 'dont want');
// new_text is "this is some sample text that i dont want to replace and this i dont want to replace as well
console.log(new_text)

Plus d'infos -> ici

2
Svetoslav Petrov

Si vous ne voulez pas utiliser regex, vous pouvez utiliser cette fonction qui remplacera tout dans une chaîne

Code source:

function ReplaceAll(mystring, search_Word, replace_with) 
{
    while (mystring.includes(search_Word))
    {
        mystring = mystring.replace(search_Word, replace_with);
    }

    return mystring;  
}

Comment utiliser:

var mystring = ReplaceAll("Test Test", "Test", "Hello"); 
2
al000y

Vous pouvez utiliser 

text.replace('old', 'new')

Et pour modifier simultanément plusieurs valeurs d'une même chaîne, par exemple pour remplacer # en chaîne v et _ en chaîne w:

text.replace(/#|_/g,function(match) {return (match=="#")? v: w;});
2
aabiro

En Javascript, replace function disponible pour remplacer la sous-chaîne d'une chaîne donnée par une nouvelle .Utiliser:

var text = "this is some sample text that i want to replace";
var new_text = text.replace("want", "dont want");
console.log(new_text);

Vous pouvez même utiliser une expression régulière avec cette fonction. Par exemple, si vous souhaitez remplacer toutes les occurrences de , par ..

var text = "123,123,123";
var new_text = text.replace(/,/g, ".");
console.log(new_text);

Ici, le modificateur g utilisé pour faire correspondre globalement toutes les correspondances disponibles.

2
Lovepreet Singh

Méthode pour replace substring in a sentence en utilisant React:

 const replace_in_javascript = (oldSubStr, newSubStr, sentence) => {
    let newStr = "";
    let i = 0;
    sentence.split(" ").forEach(obj => {
      if (obj.toUpperCase() === oldSubStr.toUpperCase()) {
        newStr = i === 0 ? newSubStr : newStr + " " + newSubStr;
        i = i + 1;
      } else {
        newStr = i === 0 ? obj : newStr + " " + obj;
        i = i + 1;
      }
    });
    return newStr;
  };

RunMethodHere

2
bh4r4th
function str_replace($old, $new, $text)
{
   return ($text+"").split($old).join($new); 
}

Vous n'avez pas besoin de bibliothèques supplémentaires. 

0
18C