JavaScript의 문자열에서 공백 제거
Kirill Ibrahim
2024년2월15일
이 기사에서는 문자열에서 공백을 제거하는 다양한 방법, 특히 탭과 줄 바꿈을 제거하는 방법을 소개합니다. 아래의 모든 메서드에는 컴퓨터에서 실행할 수있는 코드 예제가 있습니다.
replace()메소드는 지정된 값 또는 정규 표현식을 사용하여 주어진 문자열에서 대체합니다. 지정된 값이 대체되는 새 문자열을 반환합니다.
공백 만 바꾸기 위해replace()사용
string.replace(/ /g, '')
정규식에는 공백 문자 (" ")와 전역 속성이 포함됩니다. 두 번째 매개 변수에 지정된대로 문자열의 모든 공백을 검색하고 빈 문자열로 대체합니다.
예
<!DOCTYPE html>
<html>
<head>
<title>
Remove spaces from a string using JavaScript
</title>
</head>
<body>
<h2>
Remove spaces from a string using JavaScript
</h2>
<p>
Original string is:
site/ delft stack .com/
</p>
<p>
New Sentence is:
<span class="outputString"></span>
</p>
<button onclick="removeSpacesFromString()">
Clean Spaces
</button>
<script type="text/javascript">
const removeSpacesFromString = () => {
let text1 =
"site/ delft stack .com/";
let text2 =
text1.replace(/ /g, "");
document.querySelector('.outputString').textContent
= text2;
}
</script>
</body>
</html>
출력:
replace()를 사용하여 모든 공백 만 바꾸기
string.replace(/\s+/g, '')
정규 표현식 패턴\s는 공백, 탭, 줄 바꿈과 같은 모든 공백 기호를 나타냅니다.
예:
<script type="text/javascript">
const removeSpacesFromString = () => {
let text1 =
"site/ delft stack .com/";
let text2 =
text1.replace(/\s+/g, '');
document.querySelector('.outputString').textContent
= text2;
}
</script>
split()및join()메서드를 사용하여 JavaScript의 문자열에서 공백 제거
split()메서드는 문자열을 배열로 분할하고 새 배열을 반환합니다.
join()메서드는 배열의 모든 요소를 연결하여 새 문자열을 반환합니다.
split 메소드를 사용하여 공백 문자" "를 구분 기호로 사용하여 문자열을 배열로 분할 한 다음join메소드를 사용하여 배열을 문자열로 변환합니다. 이 두 가지 방법을 사용하여 공백을 제거합니다.
예:
<html>
<head>
<title>
Remove spaces from a string using JavaScript
</title>
</head>
<body>
<h2>
Remove spaces from a string using JavaScript
</h2>
<p>
Original string is:
site/ delft stack .com/
</p>
<p>
New Sentence is:
<span class="outputString"></span>
</p>
<button onclick="removeSpacesFromString()">
Clean Spaces
</button>
<script type="text/javascript">
const removeSpacesFromString = () => {
let text1 =
"site/ delft stack .com/";
let text2 =
text1.split(" ").join("");
document.querySelector('.outputString').textContent
= text2;
}
</script>
</body>
</html>