모든 문자열을 바꾸는 방법?

이 문자열이 있습니다.

"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 개발자 네트워크 의 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);
};

효율성 측면에서 정규 표현식이이면에서 어떻게 작동하는지에 대해 너무 많이 알지 못했지만 성능에 대해 생각하지 않고 과거에 분할 및 구현에 의존하는 경향이있었습니다. 어느 쪽이 더 효율적이고 어떤 마진으로 궁금해했을 때 나는 그것을 핑계로 사용했습니다.

내 크롬 윈도우 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 replace " '" "" ""

@Mike, 내가 준 대답을 확인하십시오 ... regexp가 subsrting의 여러 항목을 대체하는 유일한 방법은 아닙니다. 유연하게 생각하고 분할 생각하십시오!

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

실제로, 이것은 아마도 당신이 원하는 것이 아닐 것입니다. 그렇다면 무엇입니까? 조건부로 'cat'만 바꾸는 정규식 IMHO (즉, 단어의 일부가 아님)

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 가용성에 대한 설명

'replaceAll'메소드가 String의 프로토 타입에 추가됩니다. 이는 모든 문자열 객체 / 리터럴에 사용할 수 있음을 의미합니다.

예 :

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

사용 RegExp에 자바 스크립트를 잊지 마세요, 단순히 코드를 다음과 같이 할, 당신을 위해 일을 할 수있는 /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')모든 발생 ( 'g'플래그) 과 일치하는 RegExp를 만듭니다 "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 )!

• 2017 년 7 월 27 일 업데이트 : 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 자

재귀 솔루션 RA 및 RB 는

RangeError : 최대 호출 스택 크기를 초과했습니다

1M 캐릭터의 경우 Chrome을 손상시킵니다.

다른 솔루션에 대해 1M 문자에 대한 테스트를 시도하지만 E, F, G, H 는 브라우저가 스크립트를 중단하도록 요청하는 데 많은 시간이 걸리므로 테스트 문자열을 275K 문자로 줄입니다. 여기 에서 컴퓨터에서 테스트를 실행할 수 있습니다 . 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>

찾고자하는 문자열이 이미 있고 정규 표현식 이스케이프가없는 경우 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 글로벌을 의미