Как заменить все вхождения строки?

У меня есть эта строка:

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

Выполнение:

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

кажется, только удалить первое вхождение abcв строке выше.

Как я могу заменить все вхождения этого?

Примечание: не используйте это в коде, критичном к производительности.

В качестве альтернативы регулярным выражениям для простой литеральной строки, вы можете использовать

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

Общая картина

str.split(search).join(replacement)

Раньше это было быстрее в некоторых случаях, чем при использовании replaceAllрегулярных выражений, но в современных браузерах этого больше не происходит.

Тест: https://jsperf.com/replace-all-vs-split-join

Вывод: если у вас есть сценарий использования, критичный к производительности (например, обработка сотен строк), используйте метод Regexp. Но для большинства типичных случаев лучше не беспокоиться о специальных символах.

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

В ответ на комментарий:

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

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

В ответ на комментарий Click Upvote вы можете упростить его еще больше:

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

Примечание. Регулярные выражения содержат специальные (мета) символы, и поэтому опасно слепо передавать аргумент в findфункции выше без предварительной обработки для экранирования этих символов. Это описано в Mozilla Developer Network «s Guide JavaScript на регулярных выражениях , где они представляют следующую функцию полезности (которая изменилась , по крайней мере в два раза , так как этот ответ был изначально написано, так что не забудьте проверить сайт MDN для потенциальных обновлений):

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

Таким образом, чтобы сделать replaceAll()вышеописанную функцию более безопасной, ее можно изменить на следующую, если вы также включите escapeRegExp:

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

Для полноты картины я задумался о том, какой метод я должен использовать для этого. Есть два основных способа сделать это, как предлагают другие ответы на этой странице.

Примечание. Как правило, расширение встроенных прототипов в JavaScript обычно не рекомендуется. Я предоставляю в качестве расширений прототипа String просто в целях иллюстрации, демонстрируя различные реализации гипотетического стандартного метода на Stringвстроенном прототипе.

Реализация на основе регулярных выражений

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

Разделение и объединение (функциональная) реализация

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

Не зная слишком много о том, как регулярные выражения работают за кулисами с точки зрения эффективности, я склонялся к расколу и присоединялся к реализации в прошлом, не задумываясь о производительности. Когда я задумался о том, что было более эффективно и по какой причине, я использовал это как предлог для выяснения.

На моем компьютере с Chrome Windows 8 реализация на основе регулярных выражений является самой быстрой , а реализация разбиения и объединения выполняется на 53% медленнее . Это означает, что регулярные выражения в два раза быстрее для ввода lorem ipsum, который я использовал.

Проверьте этот тест, запустив эти две реализации друг против друга.

Как отмечается в комментарии ниже @ThomasLeduc и других, может быть проблема с реализацией на основе регулярных выражений, если она searchсодержит определенные символы, которые зарезервированы как специальные символы в регулярных выражениях . Реализация предполагает, что вызывающая сторона будет избегать строки заранее или будет передавать только те строки, которые не имеют символов в таблице в регулярных выражениях (MDN).

MDN также предоставляет реализацию, позволяющую избежать наших строк. Было бы хорошо, если бы это также было стандартизировано RegExp.escape(str), но, увы, его не существует:

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

Мы могли бы вызывать escapeRegExpв нашей String.prototype.replaceAllреализации, однако я не уверен, насколько это повлияет на производительность (потенциально даже для строк, для которых экранирование не требуется, как для всех буквенно-цифровых строк).

Использование регулярного выражения с установленным gфлагом заменит все:

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

Смотрите здесь также

Вот функция-прототип строки, основанная на принятом ответе:

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

РЕДАКТИРОВАТЬ

Если у вас findбудут специальные символы, вам нужно их избежать:

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

Скрипка: http://jsfiddle.net/cdbzL/

Обновить:

Уже несколько поздно для обновления, но так как я просто наткнулся на этот вопрос и заметил, что мой предыдущий ответ не тот, которым я доволен. Поскольку вопрос касался замены одного слова, невероятно, что никто не думал об использовании границ слов ( \b).

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

Это простое регулярное выражение, которое в большинстве случаев избегает замены частей слов. Тем не менее, тире -все еще считается границей слова. Поэтому в этом случае можно использовать условные выражения, чтобы избежать замены строк, таких как 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"

в основном, этот вопрос такой же, как и здесь: Javascript заменяет «» на «»

@ Майк, проверь ответ, который я там дал ... regexp - не единственный способ заменить несколько вхождений подстроки, это далеко не так. Думай гибко, думай о разделении!

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

В качестве альтернативы, чтобы предотвратить замену частей слова - что будет делать и одобренный ответ! Вы можете обойти эту проблему, используя регулярные выражения, которые, я признаю, несколько более сложны и, как следствие, тоже немного медленнее:

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

Вывод такой же, как принятый ответ, однако с использованием выражения / cat / g в этой строке:

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" ?? 

Ой, действительно, это, вероятно, не то, что вы хотите. Что же тогда? ИМХО, регулярное выражение, которое заменяет только «условно». (то есть не часть слова), вот так:

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"

Я думаю, это отвечает вашим потребностям. Конечно, это не полная защита, но этого должно быть достаточно, чтобы вы начали. Я бы порекомендовал прочитать еще на этих страницах. Это окажется полезным в совершенствовании этого выражения для удовлетворения ваших конкретных потребностей.

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

http://www.regular-expressions.info

Заключительное дополнение:

Учитывая, что этот вопрос по-прежнему получает много просмотров, я подумал, что мог бы добавить пример .replaceиспользования с функцией обратного вызова. В этом случае это значительно упрощает выражение и обеспечивает еще большую гибкость, например, замену на правильную прописную букву или замену обоих catи сразу cats:

'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

Сопоставить с глобальным регулярным выражением:

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

Для замены однократного использования:

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

Для замены несколько раз используйте:

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

Это самые распространенные и читаемые методы.

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

Способ 1:

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

Способ 2:

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

Способ 3:

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

Способ 4:

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

Вывод:

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

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

Или попробуйте функцию replaceAll отсюда:

Какие полезные методы JavaScript расширяют встроенные объекты?

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

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

РЕДАКТИРОВАТЬ: разъяснения о заменеВсе наличие

Метод replaceAll добавлен в прототип String. Это означает, что он будет доступен для всех строковых объектов / литералов.

Например

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

Использование RegExpв JavaScript может помочь вам, просто сделайте что-то вроде приведенного ниже кода, не забывайте, /gпосле чего выделяется глобальное :

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

Если вы думаете о повторном использовании, создайте функцию, которая сделает это за вас, но это не рекомендуется, поскольку это всего лишь одна строчная функция, но, опять же, если вы интенсивно ее используете, вы можете написать что-то вроде этого:

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

и просто используйте его в своем коде снова и снова, как показано ниже:

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

Но, как я упоминал ранее, это не будет иметь большого значения с точки зрения написания строк или производительности, только кэширование функции может повлиять на более высокую производительность на длинных строках, а также на хорошую практику DRY-кода, если вы захотите использовать повторно.

Скажем, вы хотите заменить все «abc» на «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

Я пытался придумать что-то более простое, чем модификация прототипа строки.

Используйте регулярное выражение:

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

Замена одинарных кавычек:

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

    return text;
}

// зациклить его, пока число вхождений не достигнет 0. ИЛИ просто скопировать / вставить

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

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

работал лучше для меня, чем приведенные выше ответы. поэтому new RegExp("abc", 'g')создает RegExp, который соответствует всему вхождению ( 'g'флагу) текста ( "abc"). Вторая часть - это то, что заменяется в вашем случае пустой строкой ( ""). strэто строка, и мы должны переопределить ее, так как replace(...)просто возвращает результат, но не переопределяет. В некоторых случаях вы можете использовать это.

Это самая быстрая версия, которая не использует регулярные выражения .

Пересмотренный jsperf

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

Это почти в два раза быстрее, чем метод split и join.

Как указано в комментарии здесь, это не будет работать, если ваша omitпеременная содержит place, как в:, replaceAll("string", "s", "ss")потому что она всегда сможет заменить другое вхождение слова.

На моей рекурсивной замене есть еще один jsperf с вариантами, которые идут еще быстрее ( http://jsperf.com/replace-all-vs-split-join/12 )!

• Обновление от 27 июля 2017 года. Похоже, что RegExp теперь имеет самую быструю производительность в недавно выпущенном Chrome 59.

Представление

Сегодня 27.12.2019 я выполняю тесты на macOS v10.13.6 (High Sierra) для выбранных решений.

Выводы

• str.replace(/abc/g, '');( C ) является хорошим кросс-браузер быстрое решение для всех строк.
• Решения, основанные на split-join( A, B ) или replace( C, D ), быстрые
• Решения, основанные на while( E, F, G, H ), являются медленными - обычно в ~ 4 раза медленнее для маленьких строк и примерно в ~ 3000 раз (!) Медленнее для длинных строк
• Рекуррентные решения ( RA, RB ) являются медленными и не работают для длинных строк

Я также создаю свое собственное решение. Похоже, что в настоящее время это самый короткий вопрос, который выполняет работу с вопросом:

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);

подробности

Тесты проводились на Chrome 79.0, Safari 13.0.4 и Firefox 71.0 (64 бит). Тесты RAи RBиспользование рекурсии. Результаты

Короткая строка - 55 символов

Вы можете запустить тесты на своем компьютере ЗДЕСЬ . Результаты для Chrome:

Длинная строка: 275 000 символов

Рекурсивные решения РА и РБ дает

RangeError: превышен максимальный размер стека вызовов

Для персонажей 1M они даже ломают Chrome

Я пытаюсь выполнить тесты для 1М символов для других решений, но E, F, G, H отнимает столько времени, что браузер просит меня разбить скрипт, поэтому я сокращаю тестовую строку до 275К символов. Вы можете запустить тесты на своем компьютере ЗДЕСЬ . Результаты для Chrome

Код, используемый в тестах

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>

Если то, что вы хотите найти, уже находится в строке, и вы не имеете под рукой regex escaper, вы можете использовать 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;
}

Мне нравится этот метод (выглядит немного чище):

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

Самый простой способ сделать это без использования регулярных выражений - это разделить и объединить, как показано здесь:

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', '');
}

Если строка содержит похожий шаблон, например abccc, вы можете использовать это:

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

Предыдущие ответы слишком сложны. Просто используйте функцию замены следующим образом:

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

Пример:

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

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

console.log(res);

Если вы пытаетесь гарантировать, что искомая строка не будет существовать даже после замены, вам нужно использовать цикл.

Например:

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

После завершения у вас все еще будет «test abc»!

Самый простой цикл для решения этой проблемы:

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

Но это запускает замену дважды для каждого цикла. Возможно (рискуя быть отвергнутым), что может быть объединено для немного более эффективной, но менее читаемой формы:

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

Это может быть особенно полезно при поиске дублирующих строк.
Например, если у нас есть «a ,,, b» и мы хотим удалить все повторяющиеся запятые.
[В этом случае можно сделать .replace (/, + / g, ','), но в какой-то момент регулярное выражение становится сложным и достаточно медленным, чтобы выполнять цикл.]

Хотя люди упоминали об использовании регулярных выражений, но есть лучший подход, если вы хотите заменить текст независимо от случая текста. Как прописные или строчные. Используйте ниже синтаксис

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

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

Вы можете сослаться на подробный пример здесь .

Вы можете просто использовать метод ниже

/**
 * 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);
};

Просто добавь /g

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

в

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

/g означает глобальный