[JavaScript] 자바스크립트 문자열 공백제거 하는 방법(trim, replace)

자바스크립트에서 문자열에 포함되어 있는 공백을 제거하는 방법에는 trim() 메서드를 사용하는 방법과, replace() 메서드를 사용하는 방법이 있습니다. 이번 포스팅에서는 문자열에 포함되어 있는 공백을 제거하는 방법에 대해 알아보도록 하겠습니다.

 

 자바스크립트 문자열 공백제거 하는 방법 

trim() 메서드 사용 - 문자열 양끝에 공백 제거

//사용법
문자열.trim()

 

See the Pen 공백제거-trim() by wjdxo513 (@wjdxo513) on CodePen.

 

위 예시처럼 문자열 변수 뒤에 tirm() 메서드를 호출하면 해당 문자열의 양 끝에 있는 공백이 제거된 새로운 문자열이 반환됩니다. 참고로 이때 원래 문자열 변수인 str은 변경되지 않습니다. 이렇게 trim() 메서드는 공백 문자열(스페이스, 탭, 개행 등)을 제거하므로, 예를 들어 \n, \t와 같이 여러 종류의 공백이 포함된 문자열도 처리할 수 있습니다.

 

---

 

replace 메서드 사용 - 문자열 공백제거

//사용법
문자열.replace(기존 문자열, 바꿀 문자열)

• 기존 문자열 : 대체할 문자열로 공백제거는 정규 표현식으로 문자열에서 공백을 검색하여 찾습니다.
• 바꿀 문자열 : 대체될 새로운 문자열로써 해당 값으로 치환합니다. 공백제거의 경우 "" 빈값이 됩니다.

 

See the Pen 공백제거-replace1 by wjdxo513 (@wjdxo513) on CodePen.

 

위의 예제에서 replace의 첫 번째 인자값으로는 정규표현식을 활용하여 공백을 찾아주고, 두 번째 인자값으로 빈 문자열("")을 넣었기 때문에 공백을 제거한 새로운 문자열이 반환한 뒤 출력합니다. 이때 정규표현식을 어떻게 사용하느냐에 따라 결과값이 달라지게 되는데 위의 예제처럼 사용하면 문자열에 포함되어 있는 모든 공백을 제거합니다. 양끝만 제거하고 싶다면 str.replace(/^\s+|\s+$/g, ""); 이렇게 사용하시면 됩니다.

 

공백 정규표현식 설명

\s : 공백을 나타내는 메타 문자입니다.
/g : 플래그는 전역 검색을 의미하며, 문자열 전체에서 정규표현식의 패턴을 찾아 모두 대체합니다.