자바스크립트] 문자열 양쪽 공백 제거, 정규식 사용; Trim Trailing Spaces, JavaScript Regex

문자열의 앞이나 뒤에 붙어 있는 불필요한 공백 문자(스페이스; 탭 문자 포함)를 삭제하는 함수가, 자바스크립트에는 내장되어 있지 않기에, 직접 만들어 주어야 합니다.


위와 같은 문자열이 있을 때(작은 따옴표는 제외), 앞에 1칸, 뒤에 3칸의 공백이 있는데, 다음의 trim() 함수로 공백을 제거할 수 있습니다.

다만 문자열 속에 포함되어 있는 공백들은 아무리 많아도 그대로 둡니다.

JavaScript Regex: 좌우 스페이스/탭(Tab) 문자 지우기 함수 예제

파일명: test.html


위의 예제를 브라우저로 보면

이렇게 2가지로 출력됩니다. 어떤 경우든 좌우 공백은 깨끗이 정리되었습니다.

1번째 출력 결과를 보면, 문자열 속의 공백까지 1개로 압축된 것처럼 보이지만, 그것은 HTML에서 여러 개의 공백을 1개의 공백으로 표현하기 때문이고, 실제로는 문자열 속의 공백이 사라진 것이 아닙니다.

2번째 결과는, '공백을 있는 그대로 표현하는 태그'인 <pre> 안에 넣어서 출력한 결과인데, 역시 문자열 속의 공백은 그대로 있다는 사실을 알 수 있습니다.

자바스크립트 정규식 설명

replace(/^\s*|\s*$/g, '')

^ : 문자열의 시작
\s* : 임의의 개수의 공백 문자, \s 가 공백, *가 임의의 개수
| : OR 기호
$ : 문자열의 끝
g : 문자열의 모든 부분에 걸쳐 글로벌하게 치환
'' : 치환할 빈 문자열임. 작은따옴표2개임. 빈 문자열로 치환(replace)하면 문자열 삭제가 됨

즉, 문자열의 첫부분에 붙은 공백들과, 끝부분에 붙은 공백들을 모두 삭제하라는 뜻이 됩니다.