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

У мене є цей рядок:

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

У відповідь на коментар натискання 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);
};

EDIT

Якщо у вас findбудуть спеціальні символи, вам потрібно уникнути їх:

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

Fiddle: 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 замінити "" "на" ""

@Mike, перевіри відповідь, яку я там дав ... 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" ?? 

На жаль, це, мабуть, не те, що ви хочете. Що ж тоді? IMHO, регулярний вираз, який лише умовно замінює 'cat'. (тобто не частина слова), наприклад:

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

Або спробуйте функцію zamjeAll звідси:

Які корисні методи JavaScript розширюють вбудовані об’єкти?

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

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

EDIT: Роз'яснення щодо заміниВсі доступності

До прототипу String додано метод 'zamjeна всі'. Це означає, що він буде доступний для всіх рядкових об'єктів / літералів.

Напр

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

Це майже вдвічі швидше, ніж метод розділення та з'єднання.

Як зазначено в коментарі тут, це не працюватиме, якщо ваша 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, '');( З ) є хорошим крос-браузер швидке рішення для всіх рядків.
• Рішення на основі 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 символів

Рекурсивні рішення RA і RB дає

RangeError: Максимальний розмір стека викликів перевищено

Для 1М символів вони навіть зламають 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>

Якщо те, що ви хочете знайти, вже є в рядку, і у вас немає підключення регулярного вираження, ви можете використовувати приєднання / розділення:

    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 означає глобальний