js_javascript 기술에서 공백을 제거하는 12가지 실용적인 방법

구현 1

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

String .prototype.trim = function() {
return this.replace(/^ss*/, '').replace(/ss*$/, ''); 🎜>보세요 별로 좋아 보이지는 않습니다. 주로 브라우저의 내부 최적화로 인해 실제 속도가 매우 놀랍습니다. 유명한 예는 문자열 접합(string splicing)입니다. Array로 만든 StringBuffer보다 직접 추가가 더 빠릅니다. base2 클래스 라이브러리는 이 구현을 사용합니다.

구현 2



코드 복사

코드는 다음과 같습니다 String.prototype.trim = function() { return this.replace(/^s /, '').replace(/s $/, '')

}

구현 1과 매우 유사하지만 처음에 하나 이상의 공백 문자가 있다고 가정하기 때문에 약간 느립니다. Prototype.js는 이 구현을 사용하지만 Prototype의 메소드는 Ruby와 동일한 이름을 가지려고 노력하기 때문에 이름은 스트립입니다.

구현 3



코드 복사

코드는 다음과 같습니다. String.prototype.trim = function() { return this.substring(Math.max(this.search(/S/), 0),this.search(/Ss*$/) 1 );

}

가로채기를 통해 공백 부분을 얻으며(물론 중간에 공백 문자도 허용됨) 총 4개의 네이티브 메서드가 호출됩니다. 매우 교묘하게 설계된 하위 문자열은 두 개의 숫자를 매개변수로 사용합니다. Math.max는 두 개의 숫자를 매개변수로 사용하고 검색은 하나의 숫자를 반환합니다. 위의 두 가지보다 약간 느리지만 아래의 대부분보다 빠릅니다.

구현 4



코드 복사

코드는 다음과 같습니다 String.prototype.trim = function() { return this.replace(/^s |s $/g, '')

}

이것 위의 구현 2의 단순화된 버전은 후보 연산자를 사용하여 두 정규식을 연결하는 것입니다. 하지만 그렇게 하면 브라우저 최적화 기회를 잃게 되며 이는 3을 구현하는 것만큼 좋지 않습니다. 우아해 보이기 때문에 JQuery, mootools 등 많은 라이브러리에서 사용합니다

구현 5



코드 복사

코드는 다음과 같습니다. String.prototype.trim = function() { var str = this

str = str.match(/S ( ? :s S )*/);

return str ? str[0] : '';


match는 배열을 반환하므로 요구 사항은 그것의 요소가 되는 것입니다. 문자열 중간에 있는 공백 문자가 제외되는 것을 방지하려면 비캡처 그룹화(?:exp)를 사용해야 합니다. 배열이 비어 있을 수 있으므로 나중에 추가 결정을 내려야 합니다. 브라우저는 그룹화 처리가 상대적으로 약하고, 단어 하나도 느린 것 같습니다. 그러므로 규칙성이 기본적으로 전능하더라도 규칙성에 대해 미신을 품지 마십시오.


구현 6

코드 복사

코드는 다음과 같습니다. String.prototype.trim = function() { return this.replace(/^s*(S*(s S )*)s*$/, '$1') }

요구사항에 맞는 부품을 제공하여 빈 문자열에 넣어줍니다. 그러나 특히 IE6에서는 효율성이 매우 낮습니다.


구현 7

코드 복사

코드는 다음과 같습니다. String.prototype.trim = function() { return this.replace(/^s*(S*(?:s S )*)s*$/, '$1'); >}

구현 6과 매우 유사하지만 이를 활용하기 위해 비캡처 그룹화를 사용하고 성능 효율성이 약간 향상됩니다.


구현8

코드 복사

코드는 다음과 같습니다 String.prototype.trim = function() { return this.replace(/^s*((?:[Ss]*S)?)s*$/, '$1'); 🎜>}
위의 두 가지 아이디어를 개선하여 비캡처 그룹과 문자 집합을 사용하고 * 대신 ?를 사용하면 효과가 놀랍습니다. 특히 IE6에서 이러한 성능 향상은 미친 짓이라고 할 수 있으며, 직접적으로 Firefox를 죽이기도 합니다.

구현9

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

String.prototype.trim = function() {
return this.replace(/^s*([Ss]*?)s*$/, '$1')
}

이번에는 비캡처 그룹화를 대체하기 위해 지연 매칭이 사용되었습니다. 이는 Firefox에서 지난번만큼 개선되었습니다.

구현 10

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

String.prototype.trim = function() {
var str = this,
whitespace = 'nrtfx0bxa0u2000u2001u2002u2003u2004u2005u2006u2007u2008u2009u200au200bu2028u202 9u3000' ;
for (var i = 0,len = str.length; i < ; len; i ) {
if (whitespace.indexOf(str.charAt(i)) === -1) {
str = str.substring(i)
}
}
for (i = str.length - 1; i >= 0; i--) {
if (whitespace.indexOf(str.charAt(i)) === -1) {
str = str.substring(0, i 1);
break;
}
}
return whitespace.indexOf(str.charAt(0)) === -1 ? str : ' ';
}

이것을 만든 사람은 더 이상 소가 아니라 이미 신의 수준에 있다는 것을 말하고 싶습니다. 먼저 가능한 모든 공백 문자를 나열하고, 첫 번째 순회에서 앞의 공백 문자를 잘라내고, 두 번째 패스에서 다음 공백 문자를 잘라냅니다. 전체 프로세스에서는 문자열 처리를 위해 특별히 설계된 기본 메서드인 indexOf 및 substring만 사용하며 정규식은 사용하지 않습니다. 속도는 놀라울 정도로 빠르며 내부 바이너리 구현에 가까운 것으로 추정되며 IE와 Firefox(물론 다른 브라우저도 포함)에서 잘 작동합니다. 속도는 0밀리초입니다.


구현 11

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

String.prototype.trim = function() {
var str = this,
str = str.replace(/^s /, ''); for (var i = str .length - 1; i >= 0; i--) {
if (/S/.test(str.charAt(i))) {
str = str.substring(0, i 1) ;
break;
}
}
return str;
}


구현 10에서는 일반 네이티브 문자열 가로채기 방법이 훨씬 낫다고 합니다. 교체는 조금 더 복잡하지만. 그러나 정규식이 너무 복잡하지 않은 한 브라우저의 정규식 최적화를 사용하여 IE에서 8의 성능을 달성하는 등 프로그램 실행 효율성을 향상시킬 수 있습니다. 공백 구현이 너무 길고 기억하기 어렵기 때문에 일반적으로 프로젝트에서 구현 10을 사용하는 사람은 없을 것 같습니다(물론 클래스 라이브러리를 구축하는 경우에는 확실히 첫 번째 구현입니다). 구현 11은 정기적인 교체를 통해 앞부분의 공백을 잘라내고, 뒷부분을 네이티브 방식으로 처리한 버전이라고 할 수 있지만, 효과는 원래 버전보다 떨어지지 않지만 속도가 매우 빠릅니다. .

구현 12

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

String.prototype.trim = function() {

var str = this,
str = str.replace(/^ss*/, ''),
ws = /s/ ,
i = str.length;
while (ws.test(str.charAt(--i)))
return str.slice(0, i 1)


구현 10과 구현 11은 쓰기 측면에서 더 좋고 향상된 버전입니다. 성능과 속도가 아니라 메모리와 사용 편의성에 관한 것입니다. 두 전임자는 모두 0밀리초 수준에 있으며 앞으로는 작업과 위협에 사용할 것입니다.