일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- CMD
- 테이블
- Maven
- date
- Eclipse
- js
- list
- json
- Visual Studio Code
- vscode
- table
- Button
- Files
- 이탈리아
- ArrayList
- 문자열
- 배열
- 인텔리제이
- 이클립스
- javascript
- html
- input
- IntelliJ
- Java
- 자바
- CSS
- string
- 자바스크립트
- windows
- Array
- Today
- Total
어제 오늘 내일
[Javascript] 문자열 합치기 (3가지 방법) 본문
Javascript에서 문자열을 이어붙이는 3가지 방법을 소개합니다.
1. '+' 연산자
2. concat() 함수
3. join() 함수
1. '+' 연산자
See the Pen 문자열 by anna (@hianna) on CodePen.
숫자를 더 할 때 '+' 연산자를 사용하는 것처럼
문자열을 이어줄 때도 위와 같이 '+' 연산자를 사용할 수 있습니다.
이 글에서 소개할 문자열을 이어주는 방법 중 가장 성능이 뛰어납니다.
See the Pen 문자열 by anna (@hianna) on CodePen.
숫자를 더해줄 때마 마찬가지로 '+=' 연산자를 사용할 수도 있습니다.
2. concat() 함수
str.concat(str2, str3.....strN)
- concat()함수는 str과 파라미터로 입력받은 str2, str3... 문자열을 모두 이어붙인 문자열을 리턴합니다.
- str2는 필수 입력값이고, 나머지는 선택 입력값입니다.
기본 예제
See the Pen 문자열 by anna (@hianna) on CodePen.
'Hello'에 3개의 문자열 ' ', 'world', '!'를 이어붙였습니다.
파라미터로 문자열 이외의 다른 타입도 넣을 수 있습니다.
See the Pen 문자열 by anna (@hianna) on CodePen.
파라미터로 입력되는 다른 모든 타입은,
문자열을 이어붙이면서 모두 '문자열' 타입으로 자동 변경되기 때문에,
파라미터로 null이 입력되어도 오류가 발생하지 않고,
null값은 문자열 'null'로 변경되어 문자열에 합쳐집니다.
주의할 것은, 파라미터는 문자열이 아닌 타입이 들어갈 수 있지만,
str1.concat(str2) 에서 str1은 반드시 문자열이어야 합니다.
Array의 concat() 함수가 적용되지 않도록 주의하세요.
See the Pen 문자열 by anna (@hianna) on CodePen.
배열에도 배열을 이어붙이는 함수인 concat() 함수가 있습니다.
사용법도 문자열을 합쳐주는 함수은 문자열의 concat() 함수와 거의 비슷합니다.
str1.concat(str2...)에서 str1이 반드시 문자열이어야 하는 이유입니다.
str1 자리에 배열이 들어가면, 문자열을 이어붙이는게 아니라 배열을 이어붙이게 됩니다.
따라서, 문자열을 합칠 때 concat() 함수를 써야 한다면,
str1 자리에 ''(빈 문자열)을 넣고,
''.concat('Hello', ' ', 'world')
위와 같은 방식으로 사용하는 것을 권장합니다.
물론, concat 함수보다는 성능이 더 좋은 '+' 연산자를 사용하는 것을 더 추천합니다.
3. join() 함수
join() 함수는 배열의 모든 요소를 연결해 하나의 문자열로 만듭니다.
arr.join([separator])
- separator는 옵션입니다.
See the Pen 문자열 by anna (@hianna) on CodePen.
join() 함수는 배열의 모든 문자열을 이어 붙여 줍니다.
join() 함수의 장점은 문자열을 이어 붙일 때 separator(구분자)를 지정해 줄 수 있다는 것입니다.
join() 함수를 잘 활용하면 반복문을 사용하지 않고도, 문자열에 구분자를 넣어서 이어붙여 줄 수 있습니다.
문자열을 이어붙이는 3가지 방법을 알아보았습니다.
3가지 방법 중 용도에 맞는 가장 좋은 방법을 선택하여 사용하세요.
'IT > Javascript' 카테고리의 다른 글
[Javascript] 문자열 날짜(Date) 변환하기 (0) | 2020.07.20 |
---|---|
[Javascript] 문자열의 첫글자만 대문자로 변환하기 (0) | 2020.07.19 |
[Javascript] 특정 문자 위치 찾기 (indexOf 함수) (0) | 2020.07.17 |
[Javascript] 특정 위치 문자 찾기 2가지 방법 (charAt 함수, 대괄호) (0) | 2020.07.16 |
[Javascript] 문자열을 배열로 변환 (split 함수) (3) | 2020.07.15 |