Comment remplacer un caractère à un index particulier en JavaScript?

J'ai une chaîne, disons Hello worldet je dois remplacer le caractère à l'index 3. Comment puis-je remplacer un caractère en spécifiant un index?

var str = "hello world";

J'ai besoin de quelque chose comme

str.replaceAt(0,"h");

En JavaScript, les chaînes sont immuables , ce qui signifie que le mieux que vous puissiez faire est de créer une nouvelle chaîne avec le contenu modifié et d'affecter la variable à la pointer.

Vous devrez définir la replaceAt()fonction vous-même:

String.prototype.replaceAt = function(index, replacement) {
    return this.substr(0, index) + replacement + this.substr(index + replacement.length);
}

Et utilisez-le comme ceci:

var hello = "Hello World";
alert(hello.replaceAt(2, "!!")); // Should display He!!o World

Il n'y a pas de replaceAtfonction en JavaScript. Vous pouvez utiliser le code suivant pour remplacer n'importe quel caractère dans n'importe quelle chaîne à la position spécifiée:

function rep() {
    var str = 'Hello World';
    str = setCharAt(str,4,'a');
    alert(str);
}

function setCharAt(str,index,chr) {
    if(index > str.length-1) return str;
    return str.substr(0,index) + chr + str.substr(index+1);
}

<button onclick="rep();">click</button>

Tu ne peux pas. Prenez les caractères avant et après la position et enchaînez dans une nouvelle chaîne:

var s = "Hello world";
var index = 3;
s = s.substring(0, index) + 'x' + s.substring(index + 1);

Il y a beaucoup de réponses ici, et toutes sont basées sur deux méthodes:

• METHODE 1: diviser la chaîne en utilisant deux sous-chaînes et remplir le caractère entre elles
• MÉTHODE2: convertir la chaîne en tableau de caractères, remplacer un membre du tableau et le rejoindre

Personnellement, j'utiliserais ces deux méthodes dans des cas différents. Laisse-moi expliquer.

@FabioPhms: Votre méthode était celle que j'ai utilisée initialement et j'avais peur qu'elle soit mauvaise sur une chaîne avec beaucoup de caractères. Cependant, la question est de savoir quel est le nombre de personnages? Je l'ai testé sur 10 paragraphes "lorem ipsum" et cela m'a pris quelques millisecondes. Ensuite, je l'ai testé sur une corde 10 fois plus grande - il n'y avait vraiment pas de grande différence. Hm.

@vsync, @Cory Mawhorter: Vos commentaires sont sans ambiguïté; cependant, encore une fois, qu'est-ce qu'une grosse chaîne? Je suis d'accord que pour 32 ... 100kb les performances devraient être meilleures et que l'on devrait utiliser la sous-chaîne-variante pour cette opération de remplacement de caractère.

Mais qu'arrivera-t-il si je dois faire pas mal de remplacements?

Je devais effectuer mes propres tests pour prouver ce qui est plus rapide dans ce cas. Disons que nous avons un algorithme qui manipulera une chaîne relativement courte composée de 1000 caractères. Nous nous attendons à ce qu'en moyenne chaque caractère de cette chaîne soit remplacé ~ 100 fois. Ainsi, le code pour tester quelque chose comme ceci est:

var str = "... {A LARGE STRING HERE} ...";

for(var i=0; i<100000; i++)
{
  var n = '' + Math.floor(Math.random() * 10);
  var p = Math.floor(Math.random() * 1000);
  // replace character *n* on position *p*
}

J'ai créé un violon pour ça, et c'est ici . Il existe deux tests, TEST1 (sous-chaîne) et TEST2 (conversion de tableau).

Résultats:

• TEST1: 195ms
• TEST2: 6 ms

Il semble que la conversion de tableau bat la sous-chaîne de 2 ordres de grandeur! Alors - qu'est-ce qui s'est passé ici ???

Ce qui se passe réellement, c'est que toutes les opérations dans TEST2 sont effectuées sur le tableau lui-même, en utilisant l'expression d'affectation comme strarr2[p] = n. L'affectation est vraiment rapide par rapport à une sous-chaîne sur une grande chaîne, et il est clair que cela va gagner.

Il s'agit donc de choisir le bon outil pour le travail. Encore.

Le travail avec des vecteurs est généralement plus efficace pour contacter String.

Je suggère la fonction suivante:

String.prototype.replaceAt=function(index, char) {
    var a = this.split("");
    a[index] = char;
    return a.join("");
}

Exécutez cet extrait:

String.prototype.replaceAt=function(index, char) {
    var a = this.split("");
    a[index] = char;
    return a.join("");
}

var str = "hello world";
str = str.replaceAt(3, "#");

document.write(str);

En Javascript, les chaînes sont immuables, vous devez donc faire quelque chose comme

var x = "Hello world"
x = x.substring(0, i) + 'h' + x.substring(i+1);

Pour remplacer le caractère de x en i par «h»

str = str.split('');
str[3] = 'h';
str = str.join('');

One-liner utilisant String.replace avec callback (pas de support emoji):

// 0 - index to replace, 'f' - replacement string
'dog'.replace(/./g, (c, i) => i == 0? 'f': c)
// "fog"

Expliqué:

//String.replace will call the callback on each pattern match
//in this case - each character
'dog'.replace(/./g, function (character, index) {
   if (index == 0) //we want to replace the first character
     return 'f'
   return character //leaving other characters the same
})

function dothis() {
  var x = document.getElementById("x").value;
  var index = document.getElementById("index").value;
  var text = document.getElementById("text").value;
  var arr = x.split("");
  arr.splice(index, 1, text);
  var result = arr.join("");
  document.getElementById('output').innerHTML = result;
  console.log(result);
}
dothis();

<input id="x" type="text" value="White Dog" placeholder="Enter Text" />
<input id="index" type="number" min="0"value="6" style="width:50px" placeholder="index" />
<input id="text" type="text" value="F" placeholder="New character" />
<br>
<button id="submit" onclick="dothis()">Run</button>
<p id="output"></p>

Cette méthode est bonne pour les chaînes de petite longueur mais peut être lente pour un texte plus volumineux.

var x = "White Dog";
var arr = x.split(""); // ["W", "h", "i", "t", "e", " ", "D", "o", "g"]
arr.splice(6, 1, 'F');
var result = arr.join(""); // "White Fog"

/* 
  Here 6 is starting index and 1 is no. of array elements to remove and 
  final argument 'F' is the new character to be inserted. 
*/

@CemKalyoncu: Merci pour la bonne réponse!

Je l'ai également légèrement adapté pour le rendre plus proche de la méthode Array.splice (et pris en compte la note de @Ates):

spliceString=function(string, index, numToDelete, char) {
      return string.substr(0, index) + char + string.substr(index+numToDelete);
   }

var myString="hello world!";
spliceString(myString,myString.lastIndexOf('l'),2,'mhole'); // "hello wormhole!"

Cela fonctionne de manière similaire à Array.splice:

String.prototype.splice = function (i, j, str) {
    return this.substr(0, i) + str + this.substr(j, this.length);
};

Tu pourrais essayer

var strArr = str.split("");

strArr[0] = 'h';

str = strArr.join("");

Si vous souhaitez remplacer des caractères dans une chaîne, vous devez créer des chaînes modifiables. Ce sont essentiellement des tableaux de caractères. Vous pouvez créer une usine:

  function MutableString(str) {
    var result = str.split("");
    result.toString = function() {
      return this.join("");
    }
    return result;
  }

Ensuite, vous pouvez accéder aux caractères et l'ensemble du tableau convertit en chaîne lorsqu'il est utilisé comme chaîne:

  var x = MutableString("Hello");
  x[0] = "B"; // yes, we can alter the character
  x.push("!"); // good performance: no new string is created
  var y = "Hi, "+x; // converted to string: "Hi, Bello!"

En généralisant la réponse d'Afanasii Kurakin, nous avons:

function replaceAt(str, index, ch) {
    return str.replace(/./g, (c, i) => i == index ? ch : c)
}

let str = 'Hello World'
str = replaceAt(str, 1, 'u')
console.log(str) // Hullo World

Développons et expliquons à la fois l'expression régulière et la fonction de remplacement:

function replaceAt(str, index, newChar) {
    function replacer(origChar, strIndex) {
        if (strIndex === index)
            return newChar
        else
            return origChar
    }
    return str.replace(/./g, replacer)
}

let str = 'Hello World'
str = replaceAt(str, 1, 'u')
console.log(str) // Hullo World

L'expression régulière .correspond exactement à un caractère. Le gfait correspondre à tous les caractères d'une boucle for. La replacerfonction est appelée en fonction du caractère d'origine et de l'index de l'emplacement de ce caractère dans la chaîne. Nous faisons une simple ifdéclaration pour déterminer si nous allons retourner soit origCharou newChar.

Vous pouvez étendre le type de chaîne pour inclure la méthode incrustée:

String.prototype.append = function (index,value) {
  return this.slice(0,index) + value + this.slice(index);
};

var s = "New string";
alert(s.append(4,"complete "));

Ensuite, vous pouvez appeler la fonction:

J'ai fait une fonction qui fait quelque chose de similaire à ce que vous demandez, il vérifie si un caractère dans une chaîne est dans un tableau de caractères non autorisés s'il le remplace par ''

    var validate = function(value){
        var notAllowed = [";","_",">","<","'","%","$","&","/","|",":","=","*"];
        for(var i=0; i<value.length; i++){
            if(notAllowed.indexOf(value.charAt(i)) > -1){
               value = value.replace(value.charAt(i), "");
               value = validate(value);
            }
       }
      return value;
   }

cela est facilement réalisable avec RegExp!

const str = 'Hello RegEx!';
const index = 11;
const replaceWith = 'p';

//'Hello RegEx!'.replace(/^(.{11})(.)/, `$1p`);
str.replace(new RegExp(`^(.{${ index }})(.)`), `$1${ replaceWith }`);

//< "Hello RegExp"

Voici une version que j'ai trouvée si vous souhaitez styliser des mots ou des caractères individuels à leur index dans react / javascript.

replaceAt( yourArrayOfIndexes, yourString/orArrayOfStrings ) 

Exemple de travail: https://codesandbox.io/s/ov7zxp9mjq

function replaceAt(indexArray, [...string]) {
    const replaceValue = i => string[i] = <b>{string[i]}</b>;
    indexArray.forEach(replaceValue);
    return string;
}

Et voici une autre méthode alternative

function replaceAt(indexArray, [...string]) {
    const startTag = '<b>';
    const endTag = '</b>';
    const tagLetter = i => string.splice(i, 1, startTag + string[i] + endTag);
    indexArray.forEach(tagLetter);
    return string.join('');
}

Et un autre...

function replaceAt(indexArray, [...string]) {
    for (let i = 0; i < indexArray.length; i++) {
        string = Object.assign(string, {
          [indexArray[i]]: <b>{string[indexArray[i]]}</b>
        });
    }
    return string;
}

Je sais que c'est ancien mais la solution ne fonctionne pas pour un indice négatif, j'y ajoute donc un patch. j'espère que ça aide quelqu'un

String.prototype.replaceAt=function(index, character) {
    if(index>-1) return this.substr(0, index) + character + this.substr(index+character.length);
    else return this.substr(0, this.length+index) + character + this.substr(index+character.length);

}

Disons que vous souhaitez remplacer l' Kthindex (index basé sur 0) par 'Z'. Vous pouvez utiliser Regexpour ce faire.

var re = var re = new RegExp("((.){" + K + "})((.){1})")
str.replace(re, "$1A$`");

Vous pouvez utiliser la fonction suivante pour remplacer Characterou Stringà une position particulière d'une chaîne. Pour remplacer tous les cas de correspondance suivants, utilisez la String.prototype.replaceAllMatches()fonction.

String.prototype.replaceMatch = function(matchkey, replaceStr, matchIndex) {
    var retStr = this, repeatedIndex = 0;
    for (var x = 0; (matchkey != null) && (retStr.indexOf(matchkey) > -1); x++) {
        if (repeatedIndex == 0 && x == 0) {
            repeatedIndex = retStr.indexOf(matchkey);
        } else { // matchIndex > 0
            repeatedIndex = retStr.indexOf(matchkey, repeatedIndex + 1);
        }
        if (x == matchIndex) {
            retStr = retStr.substring(0, repeatedIndex) + replaceStr + retStr.substring(repeatedIndex + (matchkey.length));
            matchkey = null; // To break the loop.
        }
    }
    return retStr;
};

Tester:

var str = "yash yas $dfdas.**";

console.log('Index Matched replace : ', str.replaceMatch('as', '*', 2) );
console.log('Index Matched replace : ', str.replaceMatch('y', '~', 1) );

Production:

Index Matched replace :  yash yas $dfd*.**
Index Matched replace :  yash ~as $dfdas.**

Voici ma solution en utilisant l'opérateur ternaire et cartographique. Fin plus lisible et maintenable plus facile à comprendre si vous me le demandez.

C'est plus dans es6 et les meilleures pratiques.

function replaceAt() {
  const replaceAt = document.getElementById('replaceAt').value;

  const str = 'ThisIsATestStringToReplaceCharAtSomePosition';
  const newStr = Array.from(str).map((character, charIndex) => charIndex === (replaceAt - 1) ? '' : character).join('');

  console.log(`New string: ${newStr}`);
}

<input type="number" id="replaceAt" min="1" max="44" oninput="replaceAt()"/>

Les méthodes ici sont compliquées. Je le ferais de cette façon:

var myString = "this is my string";
myString = myString.replace(myString.charAt(number goes here), "insert replacement here");

C'est aussi simple que possible.