Jak zamienić wszystkie wystąpienia ciągu?

Mam ten ciąg:

"Test abc test test abc test test test abc test test abc"

Robić:

str = str.replace('abc', '');

wydaje się, że usuwa tylko pierwsze wystąpienie abcpowyższego ciągu.

Jak mogę zastąpić wszystkie jego wystąpienia?

Uwaga: Nie używaj tego w kodzie krytycznym dla wydajności.

Jako alternatywę dla wyrażeń regularnych dla prostego ciągu literalnego możesz użyć

str = "Test abc test test abc test...".split("abc").join("");

Ogólny wzór to

str.split(search).join(replacement)

W niektórych przypadkach było to szybsze niż używanie replaceAlli wyrażenie regularne, ale wydaje się, że nie jest tak już w nowoczesnych przeglądarkach.

Benchmark: https://jsperf.com/replace-all-vs-split-join

Wniosek: jeśli masz krytyczny przypadek użycia (np. Przetwarzanie setek ciągów znaków), użyj metody Regexp. Ale w najbardziej typowych przypadkach użycia nie warto martwić się o znaki specjalne.

str = str.replace(/abc/g, '');

W odpowiedzi na komentarz:

var find = 'abc';
var re = new RegExp(find, 'g');

str = str.replace(re, '');

W odpowiedzi na komentarz Click Upvote możesz uprościć go jeszcze bardziej:

function replaceAll(str, find, replace) {
  return str.replace(new RegExp(find, 'g'), replace);
}

Uwaga: Wyrażenia regularne zawierają znaki specjalne (meta) i dlatego niebezpieczne jest ślepe przekazywanie argumentu w findpowyższej funkcji bez wstępnego przetwarzania go w celu ucieczki od tych znaków. To jest pokryta w Mozilla Developer Network „s JavaScript przewodnika po wyrażeń regularnych , gdzie prezentują oni następującą funkcję użytkową (co zmieniło się co najmniej dwa razy, ponieważ ta odpowiedź została pierwotnie napisana, więc upewnij się, aby sprawdzić na stronie MDN dla potencjalnych aktualizacji):

function escapeRegExp(string) {
  return string.replace(/[.*+\-?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string
}

Aby więc uczynić replaceAll()powyższą funkcję bezpieczniejszą, można ją zmodyfikować w następujący sposób escapeRegExp:

function replaceAll(str, find, replace) {
  return str.replace(new RegExp(escapeRegExp(find), 'g'), replace);
}

Ze względu na kompletność, pomyślałem o tym, której metody powinienem to zrobić. Istnieją zasadniczo dwa sposoby wykonania tego, jak sugerują inne odpowiedzi na tej stronie.

Uwaga: Ogólnie rzecz biorąc, rozszerzenie wbudowanych prototypów w JavaScript zwykle nie jest zalecane. Jako rozszerzenie przedstawiam prototyp String w celach ilustracyjnych, pokazując różne implementacje hipotetycznej standardowej metody Stringwbudowanego prototypu.

Implementacja oparta na wyrażeniach regularnych

String.prototype.replaceAll = function(search, replacement) {
    var target = this;
    return target.replace(new RegExp(search, 'g'), replacement);
};

Implementacja Split and Join (funkcjonalna)

String.prototype.replaceAll = function(search, replacement) {
    var target = this;
    return target.split(search).join(replacement);
};

Nie wiedząc zbyt wiele o tym, jak wyrażenia regularne działają za kulisami pod względem wydajności, miałem tendencję do skłaniania się do podziału i przyłączania się do implementacji w przeszłości, nie myśląc o wydajności. Kiedy zastanawiałem się, która jest bardziej wydajna i przy jakim marginesie, wykorzystałem ją jako pretekst, aby się dowiedzieć.

Na moim komputerze z Chrome Windows 8 implementacja oparta na wyrażeniach regularnych jest najszybsza , a implementacja podziału i łączenia jest o 53% wolniejsza . Oznacza to, że wyrażenia regularne są dwa razy szybsze dla zastosowanego wejścia lorem ipsum.

Sprawdź ten test porównawczy między tymi dwoma implementacjami.

Jak zauważono w komentarzu poniżej autorstwa @ThomasLeduc i inni, może występować problem z implementacją opartą na wyrażeniach regularnych, jeśli searchzawiera pewne znaki, które w wyrażeniach regularnych są zastrzeżone jako znaki specjalne . Implementacja zakłada, że ​​program wywołujący będzie wcześniej uciekał z ciągu lub przekaże tylko ciągi, które nie zawierają znaków w tabeli w wyrażeniach regularnych (MDN).

MDN zapewnia również implementację pozwalającą uniknąć naszych ciągów. Byłoby miło, gdyby to również zostało znormalizowane jako RegExp.escape(str), ale niestety nie istnieje:

function escapeRegExp(str) {
  return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); // $& means the whole matched string
}

Moglibyśmy wywoływać escapeRegExpw ramach naszej String.prototype.replaceAllimplementacji, jednak nie jestem pewien, jak bardzo wpłynie to na wydajność (potencjalnie nawet dla ciągów, dla których ucieczka nie jest potrzebna, jak wszystkie ciągi alfanumeryczne).

Użycie wyrażenia regularnego z gustawioną flagą zastąpi wszystkie:

someString = 'the cat looks like a cat';
anotherString = someString.replace(/cat/g, 'dog');
// anotherString now contains "the dog looks like a dog"

Zobacz także tutaj

Oto funkcja prototypu łańcucha w oparciu o przyjętą odpowiedź:

String.prototype.replaceAll = function (find, replace) {
    var str = this;
    return str.replace(new RegExp(find, 'g'), replace);
};

EDYTOWAĆ

Jeśli twoja findwola zawiera znaki specjalne, musisz uciec przed nimi:

String.prototype.replaceAll = function (find, replace) {
    var str = this;
    return str.replace(new RegExp(find.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'), replace);
};

Fiddle: http://jsfiddle.net/cdbzL/

Aktualizacja:

Jest nieco późno na aktualizację, ale ponieważ natknąłem się na to pytanie i zauważyłem, że moja poprzednia odpowiedź nie jest tym, z którego jestem zadowolony. Ponieważ pytanie dotyczyło zamiany jednego słowa, to niewiarygodne, że nikt nie pomyślał o użyciu granic słów ( \b)

'a cat is not a caterpillar'.replace(/\bcat\b/gi,'dog');
//"a dog is not a caterpillar"

Jest to proste wyrażenie regularne, które w większości przypadków pozwala uniknąć zamiany części słów. Jednak myślnik -jest nadal uważany za granicę słów. Dlatego w tym przypadku można zastosować warunki warunkowe, aby uniknąć zamiany ciągów takich jak cool-cat:

'a cat is not a cool-cat'.replace(/\bcat\b/gi,'dog');//wrong
//"a dog is not a cool-dog" -- nips
'a cat is not a cool-cat'.replace(/(?:\b([^-]))cat(?:\b([^-]))/gi,'$1dog$2');
//"a dog is not a cool-cat"

w zasadzie to pytanie jest takie samo jak tutaj: JavaScript zamień „” na „” „”

@ Mike, sprawdź odpowiedź, której tam udzieliłem ... wyrażenie regularne nie jest jedynym sposobem na zastąpienie wielu wystąpień subskrypcji. Myśl elastycznie, myśl podziel!

var newText = "the cat looks like a cat".split('cat').join('dog');

Ewentualnie, aby zapobiec zamianie części słów - co zrobi również zatwierdzona odpowiedź! Można obejść ten problem za pomocą wyrażeń regularnych, które, przyznaję, są nieco bardziej złożone i jako rezultat tego są też nieco wolniejsze:

var regText = "the cat looks like a cat".replace(/(?:(^|[^a-z]))(([^a-z]*)(?=cat)cat)(?![a-z])/gi,"$1dog");

Dane wyjściowe są takie same, jak zaakceptowana odpowiedź, przy użyciu wyrażenia / cat / g na tym ciągu:

var oops = 'the cat looks like a cat, not a caterpillar or coolcat'.replace(/cat/g,'dog');
//returns "the dog looks like a dog, not a dogerpillar or cooldog" ?? 

Ups, to chyba nie jest to, czego chcesz. Czym więc jest? IMHO, regex, który warunkowo zastępuje „cat”. (tj. nie jest częścią słowa), tak jak:

var caterpillar = 'the cat looks like a cat, not a caterpillar or coolcat'.replace(/(?:(^|[^a-z]))(([^a-z]*)(?=cat)cat)(?![a-z])/gi,"$1dog");
//return "the dog looks like a dog, not a caterpillar or coolcat"

Domyślam się, że to odpowiada twoim potrzebom. Oczywiście nie jest to w pełni odporne, ale powinno wystarczyć, aby zacząć. Polecam przeczytać więcej na tych stronach. Przyda się to w udoskonaleniu tego wyrażenia, aby spełnić Twoje specyficzne potrzeby.

http://www.javascriptkit.com/jsref/regexp.shtml

http://www.regular-expressions.info

Ostateczne dodanie:

Biorąc pod uwagę, że to pytanie wciąż ma wiele wyświetleń, pomyślałem, że mogę dodać przykład .replaceużycia z funkcją wywołania zwrotnego. W tym przypadku radykalnie upraszcza to wyrażenie i zapewnia jeszcze większą elastyczność, na przykład zastępując poprawną pisownię wielkimi literami lub zastępując jedno cati drugie catsza jednym razem:

'Two cats are not 1 Cat! They\'re just cool-cats, you caterpillar'
   .replace(/(^|.\b)(cat)(s?\b.|$)/gi,function(all,char1,cat,char2)
    {
       //check 1st, capitalize if required
       var replacement = (cat.charAt(0) === 'C' ? 'D' : 'd') + 'og';
       if (char1 === ' ' && char2 === 's')
       {//replace plurals, too
           cat = replacement + 's';
       }
       else
       {//do not replace if dashes are matched
           cat = char1 === '-' || char2 === '-' ? cat : replacement;
       }
       return char1 + cat + char2;//return replacement string
    });
//returns:
//Two dogs are not 1 Dog! They're just cool-cats, you caterpillar

Dopasuj do globalnego wyrażenia regularnego:

anotherString = someString.replace(/cat/g, 'dog');

Aby zastąpić jednorazowe użycie:

var res = str.replace('abc', "");

Aby wymienić wiele razy, użyj:

var res = str.replace(/abc/g, "");

Są to najbardziej popularne i czytelne metody.

var str = "Test abc test test abc test test test abc test test abc"

Metoda 1:

str = str.replace(/abc/g, "replaced text");

Metoda 2:

str = str.split("abc").join("replaced text");

Metoda 3:

str = str.replace(new RegExp("abc", "g"), "replaced text");

Metoda 4:

while(str.includes("abc")){
    str = str.replace("abc", "replaced text");
}

Wynik:

console.log(str);
// Test replaced text test test replaced text test test test replaced text test test replaced text

str = str.replace(/abc/g, '');

Lub wypróbuj tutaj funkcję replaceAll:

Jakie są użyteczne metody JavaScript, które rozszerzają wbudowane obiekty?

str = str.replaceAll('abc', ''); OR

var search = 'abc';
str = str.replaceAll(search, '');

EDYCJA: Wyjaśnienie dotyczące zastępowania Wszystkie dostępne

Metoda „replaceAll” została dodana do prototypu String. Oznacza to, że będzie dostępny dla wszystkich ciągów znaków / literałów.

Na przykład

var output = "test this".replaceAll('this', 'that');  //output is 'test that'.
output = output.replaceAll('that', 'this'); //output is 'test this'

Korzystanie RegExpz JavaScript może zrobić to za Ciebie, po prostu zrób coś takiego jak poniższy kod, nie zapomnij, /gpo czym wyróżnia się globalnie :

var str ="Test abc test test abc test test test abc test test abc";
str = str.replace(/abc/g, '');

Jeśli myślisz o ponownym użyciu, utwórz funkcję, która zrobi to za Ciebie, ale nie jest to zalecane, ponieważ jest to tylko funkcja jednego wiersza, ale ponownie, jeśli intensywnie z tego korzystasz, możesz napisać coś takiego:

String.prototype.replaceAll = String.prototype.replaceAll || function(string, replaced) {
  return this.replace(new RegExp(string, 'g'), replaced);
};

i po prostu używaj go w kodzie w kółko, jak poniżej:

var str ="Test abc test test abc test test test abc test test abc";
str = str.replaceAll('abc', '');

Ale jak wspomniałem wcześniej, nie zrobi to wielkiej różnicy pod względem wierszy, które mają być napisane, ani wydajności, tylko buforowanie funkcji może wpłynąć na szybsze działanie na długich ciągach, a także dobrą praktykę DRY kodu, jeśli chcesz ponownie użyć.

Powiedz, że chcesz zamienić wszystkie „abc” na „x”:

let some_str = 'abc def def lom abc abc def'.split('abc').join('x')
console.log(some_str) //x def def lom x x def

Próbowałem wymyślić coś prostszego niż modyfikacja prototypu łańcucha.

Użyj wyrażenia regularnego:

str.replace(/abc/g, '');

Zastępowanie pojedynczych cytatów:

function JavaScriptEncode(text){
    text = text.replace(/'/g,''')
    // More encode here if required

    return text;
}

// zapętlić go, aż liczba wystąpień osiągnie wartość 0. LUB po prostu skopiuj / wklej

    function replaceAll(find, replace, str) 
    {
      while( str.indexOf(find) > -1)
      {
        str = str.replace(find, replace);
      }
      return str;
    }

str = str.replace(new RegExp("abc", 'g'), "");

działało dla mnie lepiej niż powyższe odpowiedzi. więc new RegExp("abc", 'g')tworzy RegExp, który pasuje do wszystkich wystąpień ( 'g'flag) tekstu ( "abc"). Druga część jest zastąpiona pustym ciągiem ( ""). strjest łańcuchem i musimy go przesłonić, ponieważ replace(...)po prostu zwraca wynik, ale nie zastępuje. W niektórych przypadkach możesz chcieć tego użyć.

To jest najszybsza wersja, która nie używa wyrażeń regularnych .

Zmieniono jsperf

replaceAll = function(string, omit, place, prevstring) {
  if (prevstring && string === prevstring)
    return string;
  prevstring = string.replace(omit, place);
  return replaceAll(prevstring, omit, place, string)
}

Jest prawie dwa razy szybszy niż metoda dzielenia i łączenia.

Jak wskazano w komentarzu tutaj, nie zadziała to, jeśli omitzmienna zawiera place, jak w:, replaceAll("string", "s", "ss")ponieważ zawsze będzie w stanie zastąpić inne wystąpienie tego słowa.

Jest inny jsperf z wariantami na mojej rekurencyjnej zamianie, które idą jeszcze szybciej ( http://jsperf.com/replace-all-vs-split-join/12 )!

• Aktualizacja 27 lipca 2017 r .: Wygląda na to, że RegExp ma teraz najszybszą wydajność w niedawno wydanym Chrome 59.

Wydajność

Dzisiaj 27.12.2019 Przeprowadzam testy na macOS 10.13.6 (High Sierra) dla wybranych rozwiązań.

Wnioski

• str.replace(/abc/g, '');( C ) jest dobrym cross-browser szybkie rozwiązanie dla wszystkich ciągów.
• Rozwiązania oparte na split-join( A, B ) lub replace( C, D ) są szybkie
• Rozwiązania oparte na while( E, F, G, H ) są powolne - zwykle ~ 4 razy wolniej dla małych strun i około ~ 3000 razy (!) Wolniej dla długich strun
• Rozwiązania rekurencyjne ( RA, RB ) są wolne i nie działają w przypadku długich łańcuchów

Tworzę również własne rozwiązanie. Wygląda na to, że obecnie jest to najkrótszy, który wykonuje pytanie:

str.split`abc`.join``

str = "Test abc test test abc test test test abc test test abc";
str = str.split`abc`.join``

console.log(str);

Detale

Testy przeprowadzono na Chrome 79.0, Safari 13.0.4 i Firefox 71.0 (64-bitowy). Testy RAi RBwykorzystanie rekurencji. Wyniki

Krótki ciąg znaków - 55 znaków

Możesz uruchomić testy na swoim komputerze TUTAJ . Wyniki dla Chrome:

Długi ciąg: 275 000 znaków

Rozwiązania rekurencyjne RA i RB daje

RangeError: Przekroczono maksymalny rozmiar stosu wywołań

W przypadku 1 mln znaków łamią nawet Chrome

Próbuję przeprowadzić testy dla znaków 1M dla innych rozwiązań, ale E, F, G, H zajmuje tyle czasu, że przeglądarka prosi mnie o przerwanie skryptu, więc zmniejszam ciąg testowy do 275K znaków. Możesz uruchomić testy na swoim komputerze TUTAJ . Wyniki dla Chrome

Kod użyty w testach

var t="Test abc test test abc test test test abc test test abc"; // .repeat(5000)
var log = (version,result) => console.log(`${version}: ${result}`);


function A(str) {
  return str.split('abc').join('');
}

function B(str) {
  return str.split`abc`.join``; // my proposition
}


function C(str) {
  return str.replace(/abc/g, '');
}

function D(str) {
  return str.replace(new RegExp("abc", "g"), '');
}

function E(str) {
  while (str.indexOf('abc') !== -1) { str = str.replace('abc', ''); }
  return str;
}

function F(str) {
  while (str.indexOf('abc') !== -1) { str = str.replace(/abc/, ''); }
  return str;
}

function G(str) {
  while(str.includes("abc")) { str = str.replace('abc', ''); }
  return str;
}

// src: https://stackoverflow.com/a/56989553/860099
function H(str)
{
    let i = -1
    let find = 'abc';
    let newToken = '';

    if (!str)
    {
        if ((str == null) && (find == null)) return newToken;
        return str;
    }

    while ((
        i = str.indexOf(
            find, i >= 0 ? i + newToken.length : 0
        )) !== -1
    )
    {
        str = str.substring(0, i) +
            newToken +
            str.substring(i + find.length);
    }
    return str;
}

// src: https://stackoverflow.com/a/22870785/860099
function RA(string, prevstring) {
  var omit = 'abc';
  var place = '';
  if (prevstring && string === prevstring)
    return string;
  prevstring = string.replace(omit, place);
  return RA(prevstring, string)
}

// src: https://stackoverflow.com/a/26107132/860099
function RB(str) {
  var find = 'abc';
  var replace = '';
  var i = str.indexOf(find);
  if (i > -1){
    str = str.replace(find, replace);
    i = i + replace.length;
    var st2 = str.substring(i);
    if(st2.indexOf(find) > -1){
      str = str.substring(0,i) + RB(st2, find, replace);
    }
  }
  return str;
}




log('A ', A(t));
log('B ', B(t));
log('C ', C(t));
log('D ', D(t));
log('E ', E(t));
log('F ', F(t));
log('G ', G(t));
log('H ', H(t));
log('RA', RA(t)); // use reccurence
log('RB', RB(t)); // use reccurence

<p style="color:red">This snippet only presents codes used in tests. It not perform test itself!<p>

Jeśli to, co chcesz znaleźć, znajduje się już w ciągu, a nie masz pod ręką escargera wyrażeń regularnych, możesz użyć funkcji join / split:

    function replaceMulti(haystack, needle, replacement)
    {
        return haystack.split(needle).join(replacement);
    }

    someString = 'the cat looks like a cat';
    console.log(replaceMulti(someString, 'cat', 'dog'));

function replaceAll(str, find, replace) {
  var i = str.indexOf(find);
  if (i > -1){
    str = str.replace(find, replace); 
    i = i + replace.length;
    var st2 = str.substring(i);
    if(st2.indexOf(find) > -1){
      str = str.substring(0,i) + replaceAll(st2, find, replace);
    }       
  }
  return str;
}

Podoba mi się ta metoda (wygląda trochę czystiej):

text = text.replace(new RegExp("cat","g"), "dog"); 

Najprostszym sposobem na to bez użycia wyrażenia regularnego jest podzielenie i dołączenie, tak jak kod tutaj:

var str = "Test abc test test abc test test test abc test test abc";
str.split('abc').join('')

var str = "ff ff f f a de def";
str = str.replace(/f/g,'');
alert(str);

http://jsfiddle.net/ANHR9/

while (str.indexOf('abc') !== -1)
{
    str = str.replace('abc', '');
}

Jeśli ciąg znaków zawiera podobny wzór abccc, możesz użyć tego:

str.replace(/abc(\s|$)/g, "")

Poprzednie odpowiedzi są zbyt skomplikowane. Wystarczy użyć funkcji zamiany w ten sposób:

str.replace(/your_regex_pattern/g, replacement_string);

Przykład:

var str = "Test abc test test abc test test test abc test test abc";

var res = str.replace(/[abc]+/g, "");

console.log(res);

Jeśli próbujesz upewnić się, że szukany ciąg nie będzie istniał nawet po zamianie, musisz użyć pętli.

Na przykład:

var str = 'test aabcbc';
str = str.replace(/abc/g, '');

Po zakończeniu nadal będziesz mieć „test abc”!

Najprostszą pętlą do rozwiązania tego byłoby:

var str = 'test aabcbc';
while (str != str.replace(/abc/g, '')){
   str.replace(/abc/g, '');
}

Ale to uruchamia wymianę dwa razy dla każdego cyklu. Być może (istnieje ryzyko odrzucenia) można to połączyć w celu uzyskania nieco bardziej wydajnej, ale mniej czytelnej formy:

var str = 'test aabcbc';
while (str != (str = str.replace(/abc/g, ''))){}
// alert(str); alerts 'test '!

Może to być szczególnie przydatne, gdy szukasz duplikatów ciągów.
Na przykład, jeśli mamy „a ,,, b” i chcemy usunąć wszystkie zduplikowane przecinki.
[W takim przypadku można zrobić .replace (/, + / g, ','), ale w pewnym momencie regex staje się wystarczająco złożony i powolny, aby zamiast tego zapętlić.]

Chociaż ludzie wspominali o użyciu wyrażenia regularnego, ale istnieje lepsze podejście, jeśli chcesz zastąpić tekst bez względu na wielkość liter. Jak wielkie lub małe litery. Użyj poniższej składni

//Consider below example
originalString.replace(/stringToBeReplaced/gi, '');

//Output will be all the occurrences removed irrespective of casing.

Szczegółowy przykład możesz znaleźć tutaj .

Możesz po prostu użyć poniższej metody

/**
 * Replace all the occerencess of $find by $replace in $originalString
 * @param  {originalString} input - Raw string.
 * @param  {find} input - Target key word or regex that need to be replaced.
 * @param  {replace} input - Replacement key word
 * @return {String}       Output string
 */
function replaceAll(originalString, find, replace) {
  return originalString.replace(new RegExp(find, 'g'), replace);
};

Poprostu dodaj /g

document.body.innerHTML = document.body.innerHTML.replace('hello', 'hi');

do

// Replace 'hello' string with /hello/g regular expression.
document.body.innerHTML = document.body.innerHTML.replace(/hello/g, 'hi');

/g oznacza globalny