[JavaScript] 문자열의 공백을 제거하는 trim(), replace()

📍 trim()

str.trim()

trim() 메서드는 문자열 양 끝의 공백을 제거한다.

let word = ' Christmas Day! ';
    
console.log(word.trim()); //Christmas Day!

만약 문자열에 공백이 없어도 예외가 발생하지 않고 새 문자열이 반환된다. 사실상 기존 문자열의 복사본인 것이다.
또한 맨 앞의 공백을 제거하는 trimStart() 메서드와 맨 뒤의 공백을 제거하는 trimEnd() 메서드가 있다. 공백이 잘 보이지 않기 때문에 출력할 때 '★' 모양을 양 옆에 붙여서 word의 제거 모습을 파악해보았다.

let word = ' Christmas Day ';

console.log('★' + word.trimStart() + '★');
//★Christmas Day ★

console.log('★' + word.trimEnd() + '★');
//★ Christmas Day★

메서드에 따라서 별 모양과 붙어있는 위치가 다르다는 것을 알 수 있다.

📍 replace()

str.replace(regexp|substr, newSubstr|function)

replace() 메서드는 패턴이 일치하는 부분의 문자열을 교체하여, 변경된 새로운 문자열로 반환한다.

첫 번째 인자에서 정규식 (regexp) 또는 문자열 (substr)로 바꿀 문자열을 찾는다.
두 번째 인자에서 대체할 문자열 (newSubstr) 또는 함수 (function)로 변경한다.

let word = ' Christmas Day ';

let new1 = word.replace(' ', '');
console.log(new1); //Christmas Day 

먼저 문자열로 공백을 제거한 경우이다. replace 메서드는 일치하는 문자열의 첫 번째 문자열만 변경하기 때문에 Christmas의 앞 공백만 제거되었다.

이에 따라 정규식 패턴으로 전체 공백을 지울 수 있다.

let new2 = word.replace(/ /g, '');
console.log(new2); //ChristmasDay

g 플래그는 전역 플래그이기 때문에 모든 공백을 지웠다.

cf)
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/Trim
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/replace