Bagaimana cara mengganti semua kemunculan string?

Saya punya string ini:

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

Perbuatan:

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

tampaknya hanya menghilangkan kemunculan pertama abcdalam string di atas.

Bagaimana saya bisa mengganti semua kemunculannya?

Catatan: Jangan gunakan ini dalam kode kritis kinerja.

Sebagai alternatif ekspresi reguler untuk string literal sederhana, Anda bisa menggunakannya

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

Pola umumnya adalah

str.split(search).join(replacement)

Ini digunakan dalam beberapa kasus lebih cepat daripada menggunakan replaceAlldan ekspresi reguler, tapi itu tampaknya tidak menjadi kasus lagi di browser modern.

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

Kesimpulan: Jika Anda memiliki kasus penggunaan kritis kinerja (misalnya memproses ratusan string), gunakan metode Regexp. Tetapi untuk sebagian besar kasus penggunaan umum, ini layak tidak perlu khawatir tentang karakter khusus.

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

Menanggapi komentar:

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

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

Sebagai tanggapan terhadap komentar Klik Suara , Anda dapat lebih menyederhanakannya:

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

Catatan: Ekspresi reguler mengandung karakter khusus (meta), dan karena itu berbahaya untuk secara membabi buta menyampaikan argumen dalam findfungsi di atas tanpa pra-pemrosesan untuk menghindari karakter tersebut. Hal ini tercakup dalam Mozilla Developer Jaringan 's JavaScript Panduan pada Regular Expressions , di mana mereka menyajikan fungsi utilitas berikut (yang telah berubah setidaknya dua kali sejak jawaban ini awalnya ditulis, jadi pastikan untuk memeriksa situs MDN untuk update potensial):

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

Jadi untuk membuat replaceAll()fungsi di atas lebih aman, itu dapat dimodifikasi menjadi yang berikut jika Anda juga menyertakan escapeRegExp:

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

Demi kelengkapan, saya harus memikirkan metode apa yang harus saya gunakan untuk melakukan ini. Pada dasarnya ada dua cara untuk melakukan ini seperti yang disarankan oleh jawaban lain di halaman ini.

Catatan: Secara umum, memperluas prototipe bawaan dalam JavaScript umumnya tidak disarankan. Saya menyediakan ekstensi pada prototipe String hanya untuk tujuan ilustrasi, menunjukkan implementasi yang berbeda dari metode standar hipotetis Stringpada prototipe bawaan.

Implementasi Berbasis Ekspresi Reguler

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

Implementasi Split dan Bergabung (Fungsional)

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

Tidak tahu terlalu banyak tentang bagaimana ekspresi reguler bekerja di belakang layar dalam hal efisiensi, saya cenderung condong ke arah pemisahan dan bergabung dengan implementasi di masa lalu tanpa memikirkan kinerja. Ketika saya bertanya-tanya mana yang lebih efisien, dan berapa margin, saya menggunakannya sebagai alasan untuk mencari tahu.

Di mesin Chrome Windows 8 saya, implementasi berbasis ekspresi reguler adalah yang tercepat , dengan implementasi split dan join menjadi 53% lebih lambat . Berarti ekspresi reguler dua kali lebih cepat untuk input lorem ipsum yang saya gunakan.

Lihat patokan ini menjalankan dua implementasi ini terhadap satu sama lain.

Seperti dicatat dalam komentar di bawah ini oleh @ThomasLeduc dan lainnya, mungkin ada masalah dengan implementasi berbasis ekspresi reguler jika searchberisi karakter tertentu yang dicadangkan sebagai karakter khusus dalam ekspresi reguler . Implementasi mengasumsikan bahwa penelepon akan lolos string sebelumnya atau hanya akan melewati string yang tanpa karakter dalam tabel di Regular Expressions (MDN).

MDN juga menyediakan implementasi untuk keluar dari ikatan kami. Akan lebih baik jika ini juga dibakukan sebagai RegExp.escape(str), tapi sayangnya, itu tidak ada:

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

Kita bisa memanggil escapeRegExpdalam String.prototype.replaceAllimplementasi kami , namun, saya tidak yakin seberapa banyak ini akan mempengaruhi kinerja (bahkan potensial untuk string yang tidak diperlukan melarikan diri, seperti semua string alfanumerik).

Menggunakan ekspresi reguler dengan gset bendera akan menggantikan semua:

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

Lihat di sini juga

Inilah fungsi prototipe string berdasarkan jawaban yang diterima:

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

EDIT

Jika findkehendak Anda mengandung karakter khusus maka Anda perlu menghindarinya:

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

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

Memperbarui:

Agak terlambat untuk pembaruan, tetapi karena saya baru saja menemukan pertanyaan ini, dan memperhatikan bahwa jawaban saya sebelumnya bukanlah jawaban yang saya sukai. Karena pertanyaan melibatkan penggantian satu kata, sungguh luar biasa tidak ada yang berpikir untuk menggunakan batas kata ( \b)

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

Ini adalah regex sederhana yang menghindari penggantian bagian kata dalam kebanyakan kasus. Namun, tanda hubung -masih dianggap sebagai batas kata. Jadi kondisional dapat digunakan dalam kasus ini untuk menghindari penggantian string seperti 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"

pada dasarnya, pertanyaan ini sama dengan pertanyaan di sini: Javascript ganti "'" dengan "' '"

@ Mike, periksa jawaban yang saya berikan di sana ... regexp bukan satu-satunya cara untuk mengganti beberapa kemunculan subsrting, jauh dari itu. Berpikir fleksibel, pikirkan split!

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

Atau, untuk mencegah penggantian bagian kata - yang mana jawaban yang disetujui juga akan berlaku! Saya bisa mengatasi masalah ini menggunakan ekspresi reguler yang, saya akui, agak lebih kompleks dan sebagai hasilnya, sedikit lebih lambat, juga:

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

Outputnya sama dengan jawaban yang diterima, namun, menggunakan ekspresi / cat / g pada string ini:

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 memang, ini mungkin bukan yang Anda inginkan. Apa itu? IMHO, sebuah regex yang hanya menggantikan 'kucing' dengan persyaratan. (Yaitu bukan bagian dari kata), seperti:

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"

Dugaan saya adalah, ini memenuhi kebutuhan Anda. Tentu saja, ini tidak sepenuhnya tahan, tetapi itu sudah cukup untuk Anda memulainya. Saya sarankan membaca lebih banyak di halaman-halaman ini. Ini terbukti bermanfaat dalam menyempurnakan ungkapan ini untuk memenuhi kebutuhan spesifik Anda.

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

http://www.regular-expressions.info

Penambahan akhir:

Mengingat bahwa pertanyaan ini masih mendapat banyak pandangan, saya pikir saya mungkin menambahkan contoh yang .replacedigunakan dengan fungsi panggilan balik. Dalam hal ini, ia secara dramatis menyederhanakan ekspresi dan bahkan memberikan lebih banyak fleksibilitas, seperti mengganti dengan huruf besar yang benar atau mengganti keduanya catdan catssekaligus:

'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

Cocokkan dengan ekspresi reguler global:

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

Untuk mengganti penggunaan satu kali:

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

Untuk mengganti beberapa kali gunakan:

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

Ini adalah metode yang paling umum dan mudah dibaca.

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

Metode 1:

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

Metode 2:

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

Metode 3:

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

Metode 4:

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

Keluaran:

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

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

Atau coba fungsi replaceAll dari sini:

Apa metode JavaScript yang berguna yang memperluas objek bawaan?

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

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

EDIT: Klarifikasi tentang replaceAll availability

Metode 'replaceAll' ditambahkan ke prototipe String. Ini berarti akan tersedia untuk semua objek string / literal.

Misalnya

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

Menggunakan RegExpdalam JavaScript dapat melakukan pekerjaan untuk Anda, cukup lakukan sesuatu seperti kode di bawah ini, jangan lupa /gsetelah yang menonjol untuk global :

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

Jika Anda berpikir untuk menggunakan kembali, buat fungsi untuk melakukannya untuk Anda, tetapi itu tidak disarankan karena hanya satu fungsi baris, tetapi sekali lagi jika Anda banyak menggunakan ini, Anda dapat menulis sesuatu seperti ini:

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

dan cukup gunakan dalam kode Anda berulang-ulang seperti di bawah ini:

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

Tetapi seperti yang saya sebutkan sebelumnya, itu tidak akan membuat perbedaan besar dalam hal baris untuk ditulis atau kinerja, hanya caching fungsi dapat mempengaruhi beberapa kinerja lebih cepat pada string panjang dan juga praktik yang baik dari kode KERING jika Anda ingin menggunakan kembali.

Katakanlah Anda ingin mengganti semua 'abc' dengan '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

Saya mencoba untuk memikirkan sesuatu yang lebih sederhana daripada memodifikasi prototipe string.

Gunakan ekspresi reguler:

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

Mengganti tanda kutip tunggal:

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

    return text;
}

// lilitkan sampai jumlah kejadian mencapai 0. ATAU cukup salin / tempel

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

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

bekerja lebih baik untuk saya daripada jawaban di atas. jadi new RegExp("abc", 'g')buat RegExp yang cocok dengan semua kemunculan ( 'g'bendera) teks ( "abc"). Bagian kedua adalah apa yang akan diganti, dalam kasus Anda string kosong ( ""). stradalah string, dan kita harus menimpanya, karena replace(...)hanya mengembalikan hasil, tetapi bukan menimpa. Dalam beberapa kasus, Anda mungkin ingin menggunakannya.

Ini adalah versi tercepat yang tidak menggunakan ekspresi reguler .

JSPF direvisi

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

Ini hampir dua kali lebih cepat dari metode split dan join.

Seperti yang ditunjukkan dalam komentar di sini, ini tidak akan berfungsi jika omitvariabel Anda berisi place, seperti pada:, replaceAll("string", "s", "ss")karena itu akan selalu dapat menggantikan kemunculan kata lainnya.

Ada jsperf lain dengan varian pada rekursif saya yang lebih cepat ( http://jsperf.com/replace-all-vs-split-join/12 )!

• Pembaruan 27 Juli 2017: Sepertinya RegExp sekarang memiliki kinerja tercepat di Chrome 59 yang baru dirilis.

Performa

Hari ini 27.12.2019 Saya melakukan tes pada macOS v10.13.6 (High Sierra) untuk solusi yang dipilih.

Kesimpulan

• The str.replace(/abc/g, '');( C ) adalah cross-browser solusi cepat baik untuk semua string.
• Solusi berdasarkan split-join( A, B ) atau replace( C, D ) cepat
• Solusi berdasarkan while( E, F, G, H ) lambat - biasanya ~ 4 kali lebih lambat untuk string kecil dan sekitar ~ 3000 kali (!) Lebih lambat untuk string panjang
• Solusi perulangan ( RA, RB ) lambat dan tidak bekerja untuk string panjang

Saya juga membuat solusi sendiri. Sepertinya saat ini adalah yang terpendek yang melakukan pekerjaan pertanyaan:

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

Detail

Pengujian dilakukan pada Chrome 79.0, Safari 13.0.4 dan Firefox 71.0 (64 bit). Tes RAdan RBgunakan rekursi. Hasil

String pendek - 55 karakter

Anda dapat menjalankan tes pada mesin Anda DI SINI . Hasil untuk Chrome:

String panjang: 275 000 karakter

Solusi rekursif RA dan RB memberikan

RangeError: Ukuran tumpukan panggilan maksimum terlampaui

Untuk karakter 1M mereka bahkan memecahkan Chrome

Saya mencoba melakukan tes untuk 1M karakter untuk solusi lain, tetapi E, F, G, H membutuhkan banyak waktu sehingga browser meminta saya untuk memecahkan skrip jadi saya mengecilkan string uji menjadi 275 ribu karakter. Anda dapat menjalankan tes pada mesin Anda DI SINI . Hasil untuk Chrome

Kode yang digunakan dalam tes

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>

Jika yang ingin Anda temukan sudah ada dalam string, dan Anda tidak memiliki regex escaper berguna, Anda bisa menggunakan 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;
}

Saya suka metode ini (kelihatannya sedikit lebih bersih):

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

Cara paling sederhana untuk ini tanpa menggunakan regex apa pun dibagi dan bergabung seperti kode di sini:

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

Jika string berisi pola yang mirip seperti abccc, Anda dapat menggunakan ini:

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

Jawaban sebelumnya terlalu rumit. Cukup gunakan fungsi ganti seperti ini:

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

Contoh:

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

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

console.log(res);

Jika Anda mencoba memastikan bahwa string yang Anda cari tidak akan ada bahkan setelah penggantian, Anda perlu menggunakan loop.

Sebagai contoh:

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

Ketika selesai, Anda masih akan memiliki 'test abc'!

Loop paling sederhana untuk menyelesaikan ini adalah:

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

Tapi itu menjalankan penggantian dua kali untuk setiap siklus. Mungkin (beresiko ditolak) yang dapat digabungkan untuk bentuk yang sedikit lebih efisien tetapi kurang mudah dibaca:

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

Ini bisa sangat berguna saat mencari string duplikat.
Misalnya, jika kami memiliki 'a ,,, b' dan kami ingin menghapus semua koma rangkap.
[Dalam hal ini, seseorang bisa melakukan .replace (/, + / g, ','), tetapi pada titik tertentu regex menjadi kompleks dan cukup lambat untuk diulang.]

Meskipun orang telah menyebutkan penggunaan regex tetapi ada pendekatan yang lebih baik jika Anda ingin mengganti teks terlepas dari kasus teks. Seperti huruf besar atau kecil. Gunakan sintaksis di bawah ini

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

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

Anda dapat merujuk contoh terperinci di sini .

Anda cukup menggunakan metode di bawah ini

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

Cukup tambahkan /g

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

untuk

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

/g berarti global