문자열 대체 method_javascript 기술 적용에 대한 간략한 분석

두 매개변수가 모두 필요합니다. replacement() 메소드의 매개변수 대체는 문자열 대신 함수일 수 있습니다. 이 경우 일치하는 각 항목에 대해 함수가 호출되고 해당 함수가 반환하는 문자열이 대체 텍스트로 사용됩니다. 이 함수의 첫 번째 매개변수는 패턴과 일치하는 문자열입니다. 다음 인수는 패턴의 하위 표현식과 일치하는 문자열이며 이러한 인수는 0개 이상 있을 수 있습니다. 다음 매개변수는 일치가 발생하는 stringObject의 위치를 ​​선언하는 정수입니다. 마지막 매개변수는 stringObject 자체입니다. 교체가 함수인 경우에는 매우 편리합니다.



이것은 두 단어의 순서를 바꾸는 매우 간단한 예입니다. 이를 바꾸지 않고도 수행할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

(function(){
var str = 'click dblclick';
var result = str.split( /b/ ).reverse().join('')
console.log(result);
})()

이것은 조금 번거롭지만 많은 일입니다 교체를 사용하면 더 상쾌합니다. :

코드 복사 코드는 다음과 같습니다. (){

var str = 'click dblclick';

var result = str.replace(/b(w )(s )(w )b/,'$3$2$1'); log(result);
} )();


숫자에 천분의 일 추가:

코드 복사

코드는 다음과 같습니다. (function(){ var number = 12345678900;

var result = ('' number).replace (/(d)(?= (d{3}) $)/g,'$1,')

console.log(결과)
})(); 🎜>
그런데 이제는 교체를 함수로 사용하는 것이 포인트이므로 위의 형식을 함수 형식으로 변경할 필요가 없습니다.

코드 복사


코드는 다음과 같습니다.

(function(){ var str = 'click dblclick'; var result = str.replace(/ b(w )(s )(w )b/, function(all,$1,$2,$3){ return $3 $2 $1 })

console.log(result); >})();

( function(){
var number = 12345678900;
var result = ('' number).replace(/(d)(?=(d{3 }) $)/g,function(all,$1) {
return $1 ',';
})
console.log(result)
})();

따라서 바꾸기는 일치 항목을 캡처하는 것에 지나지 않습니다. 그러면 항목이 처리되어 반환 값으로 대체됩니다. 이는 함수 비교에 지나지 않습니다.
좀 더 실용적인 예를 살펴보겠습니다. C 언어의 printf와 같이 대부분의 언어에는 형식화된 출력이 있습니다.




코드 복사

코드는 다음과 같습니다.

(function(){ var str = '%s이(가) 갔을 수도 있지만 %s의 시간이 있습니다.'; var 결과 = str .replace(/(%s)/g,function(){ return 'replacement'; }) console.log(result) })()

여기서 문제는 %s이(가) 모두 같고, 교체해도 동일하며, 순서에 따라 어떤 부분이 교체되는지만 판단할 수 있다는 것입니다. 변경해야 합니다. 그래서 우리는 변수를 전달해야 합니다.




코드 복사

코드는 다음과 같습니다.

(function(){ var array = [ 'Swallows','return']; var i = 0; var str = '%s는 사라졌지만 %s의 시간이 있습니다.' var result = str .replace( /(%s)/g,function(){ return array[i ]; })

console.log(result)

})(); (function( ){
var str = '#{what}이 없어졌을 수도 있지만 #{how}의 시간이 있습니다';
var obj = {
what : 'Swallows',
어떻게: 'return'
}
var result = str.replace(/(?:#{(w )})/g,function(all,$1){
return obj[$1];
})
console.log( result);
})();


분명히 객체 메서드가 더 안정적입니다.

동시에 js에는 이렇게 엄격한 유형 요구 사항이 없기 때문에 %s 형식도 제한이 되었습니다. 직접 폐기하고 우리가 이해하기 쉬운 형태로 대체합니다.

함수로 위장한 것은

코드 복사


코드는 다음과 같습니다.

(function(){
function gsub(str,replaceObj){
return str.replace(/(?:#{(w )})/g,function(all,$1) {
return replacementObj[$1];
})
}
console.log('gsub result:',gsub('#{what}이 없어졌을 수도 있지만 #의 시간이 있습니다. {how}',{
what : 'Swallows',
how : 'return'
}))
})()

위의 gsub에서 빌려옴 Prototype의 gsub 메소드 이름이 변경되었습니다. Prototype의 gsub는 대체를 사용하지 않지만 여전히 형태는 매우 유사합니다.

지금 우리가 직면하고 있는 문제는 다음과 같습니다.

#{what} 이런 형식의 문자열을 포함하는 충돌 문제가 발생할 수 있습니다. 이를 처리하지 않으면 결과는 다음과 같습니다. 모두가 그것을 알고 있습니다.

첫 번째 해결 방법: 정규 표현식에 이스케이프 문자가 있고, 가질 수도 있으므로 불필요한 교체 부분 앞에 ''만 추가하면 됩니다.

두 번째 해결 방법: 허용 사용자는 충돌을 피하기 위해 #{} 플래그를 대체하도록 플래그를 사용자 정의할 수 있습니다.

첫 번째 방법을 보세요:

코드를 복사하세요 코드는 다음과 같습니다.

(function(){
var str = '#{what}이 없어졌을 수도 있지만 #{how},\#{reserve}의 때가 있습니다';
function gsub(str, replacementObj){
return str.replace(/(^|.)(?:#{(w )})/g,function(all,$1,$2){
if($1 == '\' ){
return '#{' $2 '}';
}
return $1 replacementObj[$2]
})
}
console.log('gsub 결과:' ,gsub(str ,{
무엇 : '제비',
어떻게 : '반환'
}))
})()

무엇이 필요합니까? 위에서 언급한 것은 '' 입니다. 문자열에도 이스케이프 문자가 있으며 쓸 때 이스케이프해야 합니다.

두 번째 방법:

'#{what}'을 <%what%> 형식으로 바꿉니다.

코드 복사 코드는 다음과 같습니다.

(function(){
function gsub(str ,replaceObj,regexp){
regexp = regexp || /(?:#{(w )})/g;
return str.replace(regexp,function(all,$1){
return replacementObj [$1];
})
}
var str = '<%what%> 시간이 있지만 <%how%>의 시간이 있습니다.#{ 예약}'
console.log('gsub 결과:',gsub(str,{
무엇: '제비',
어떻게: '반환'
},/(?:< %(w )%>)/g))
})();

이제 String 프로토타입에 gsub를 걸어 놓습니다

코드 복사 코드는 다음과 같습니다.

String.prototype.gsub = function(replaceObj,regexp){
regexp = regexp || /(^|.) (?:(#{)(w )(}))/g;
return this.replace(regexp,function(all,$1,$2,$3,$4){
if ($1 == '\'){
$2 $3 $4 반환
}
$1 returnObj[$3]
})
}
var str = '<% what%> 없어졌을 수도 있지만 <%how%>,\<%how%>,#{how}'
var obj = {
what : ' Swallows',
방법: 'return'
}
console.log('테스트 1:',str.gsub(obj,/(^|.)(?:(<%)(w )(%>) )/g));
//제비가 갔을 수도 있지만 돌아올 때가 있습니다,<%how%>,#{how}
console.log(' 테스트 2:',str .gsub(obj));
//<%what%>가 없어졌을 수도 있지만 <%how%>,<%how%> ,return

ㅎㅎ Prototype의 gsub와 매우 유사한 것 같지만 Prototype의 gsub는 더 복잡하고 원리도 일관성이 없습니다. Prototype의 gsub 방법을 자세히 분석해 보세요. 나중에.