자바스크립트에서 문자열을 합치기 하는 것으로 concat() 메서드가 있다. + 키워드와 가시적인 결과는 같다. 어쩌면 + 키워드보다 메서드를 사용한다는 점에서 불편함도 있을 수 있다. 어쨌든 존재의 이유는 있을 것이니 문자열 합치기 메서드인 concat() 사용법은 알아두자.
자바스크립트 문자열 합치기
using javascript string concat() method
자바스크립트에서 문자열을 다루는 메서드는 많다.
자바스크립트에서 문자열을 연결할 때는 + 키워드를 사용하지만 별도로 문자열 합치기 메서드 또한 존재한다.
String.concat() 메서드로써 원본 문자열에 한개이상의 문자열을 추가할 수 있다.
갯수는 상관이 없으며 콤마로 합칠 문자열을 나열해 주면 된다.
문자열 합치기 concat() 메서드
concat() 메서드는 자바스크립트에서 문자열을 합치는 역할을 한다.
+ 키워드와 같은 동작을 한다.
+ 키워드가 있는데 굳이 이런 메서드를 만든 이유가 있을 것이다.
아마 메모리적인 것이나 혹은 문자열을 새롭게 정의하는 이유일 것이기도 하다.
물론, 내부적인 동작처리는 자세히 찾아보지 않으면 모르지만 말이다.
어쨌든 여기서 중요한 것은 자바스크립트에서 문자열 합치기를 위해 concat() 메서드를 어떻게 사용하지는 아는 것이다.
사용법
concat() 메서드를 사용하기 위해서는 추가할 문자열을 콤마로 나열해 주면 된다.
사용법은 간단하다.
단, 원본 문자열을 기준으로 추가되기 때문에 이점에 유의한다.
vStrConcat = "";
vStrConcat = vStrConcat.concat("추가할 문자열");
vStrConcat = vStrConcat.concat("추가할 문자열1", "추가할 문자열2");
vStrConcat = vStrConcat.concat("추가할 문자열1", "추가할 문자열2", "추가할 문자열3");
샘플코드
위에서 설명한 것을 토대로 문자열 합치기를 해 보도록 한다.
+ 키워드를 같이 사용하여 concat() 메서드와의 차이를 본다.
가시적인 결과로는 차이가 없긴 하다.
<!DOCTYPE html>
<html>
<body>
<h1>자바스크립트 문자열 대문자 합치기</h1>
<script>
console.log("----------");
let vStr1 = "YG Ent ";
let vStr2 = "블랙핑크 ";
let vStr3 = "지수, 제니, 로제, 리사 ";
let vStrConcat = "";
vStrConcat = vStrConcat + vStr1 + vStr2 + vStr3
console.log(typeof(vStrConcat), vStrConcat);
console.log("----------");
vStrConcat = "";
vStrConcat = vStrConcat.concat(vStr1);
console.log(typeof(vStrConcat), vStrConcat);
vStrConcat = vStrConcat.concat(vStr2);
console.log(typeof(vStrConcat), vStrConcat);
vStrConcat = vStrConcat.concat(vStr3);
console.log(typeof(vStrConcat), vStrConcat);
console.log("----------");
vStrConcat = "";
vStrConcat = vStrConcat.concat(vStr1, vStr2, vStr3);
console.log(typeof(vStrConcat), vStrConcat);
console.log("----------");
</script>
</body>
</html>
코드가 길다.
하지만, 별 것 없다.
+ 키워드와 concat() 메서드를 사용해 문자열 합치기를 어떻게 하는지만 알면 그만인 것이다.
결과화면을 보자.
+ 키워드를 사용했을 때와 concat() 메서드를 사용했을 때의 결과는 차이가 없다.
또한 concat() 메서드는 추가할 문자열을 콤마를 이용하여 나열하면 된다.
이런 경우는 아마도 실무에서 문자열을 다를 때 특정 규칙에 따라 새롭게 문자열을 만들 때 사용될 것이다.
보통 문서양식이 그렇기도 하다.
concat() 메서드를 사용하기도 하지만 replace() 같은 치환 메서드를 사용하기도 한다.
'programming > javascript' 카테고리의 다른 글
자바스크립트 문자열 자리수 채우기 javascript string padding (0) | 2021.11.11 |
---|---|
자바스크립트 문자열 공백 제거 빈문자열 없애기 removing javascript whitespace (0) | 2021.11.11 |
자바스크립트 문자열 대문자 소문자 변환하기 javascript string upper case lower case (0) | 2021.11.08 |
자바스크립트 문자열 변환 replace 함수와 정규식 사용 javascript replace and regular expresstion (0) | 2021.11.08 |
자바스크립트 문자열 변환 replace 함수 사용 javascript replace method (0) | 2021.11.07 |
댓글