일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 백준 10448 javascript
- 백준 1449 자바스크립트
- 백준 4796 nodejs
- 백준 1018 typescript
- 백준 1449 nodejs
- 백준 4796 캠핑
- 백준 1449 타입스크립트
- 백준 4796 자바스크립트
- 백준 2503 javascript
- 백준 11047 javascript
- 백준 1449
- 백준 1018 타입스크립트
- 백준 1449 javascript
- 백준 1018 자바스크립트
- 백준 11047 nodejs
- 백준 2503 nodejs
- 백준 4796 타입스크립트
- 백준 11047 자바스크립트
- 백준 2503 자바스크립트
- 백준 11047 타입스크립트
- 백준 1018 javascript
- 백준 2503 typescript
- 알고리즘
- 백준 2503 타입스크립트
- 백준 1018 nodejs
- 백준 11047 typescript
- CSS
- 백준 4796 javascript
- 백준 1449 노드
- JavaScript
- Today
- Total
POTATO THAT WANT TO BE HUMAN
[JavaScript] split()을 사용해 문자열을 배열로 반환하기 본문
자바스크립트에서 split
함수를 사용하면
문자열을 일정한 구분자로 잘라서 배열로 저장할 수 있습니다.
🤔 split() 사용하기
string.split(separator, limit)
split 함수는 문자열을 첫번째 파라미터인 separator
를 기준으로 잘라서,
두번째 파라미터인 limit
크기 이하의 배열에 잘라진 문자열을 저장하여 리턴합니다.
쉽게말해 separator
는 문자열을 잘라줄 구분자, limit
는 최대 분할 갯수입니다.
separator
에 값이 입력되지 않는다면 문자열 전체를 배열에 담아 리턴하게 됩니다.
🤔 예제를 통해 살펴보기
split을 사용할 때 파라미터의 값에 따라 결과가 다르게 나오므로
- 파라미터를 입력하지 않은 경우
- 단어별로 자를 경우
- 글자별로 자를 경우
- 특정 구분자로 자를 경우
- limit 값을 지정한 경우
이렇게 다섯가지의 경우로 나눠서 살펴보겠습니다.
1 ) 파라미터를 입력하지 않은 경우
const str = 'red blue black';
const arr = str.split();
console.log(arr); // red blue black
console.log(arr.length); // 1
위 예제처럼 파라미터를 입력하지 않을 경우에는 문자열 전체를 배열로 리턴합니다.
문자열 전체가 배열에 담겼으므로 배열의 길이는 1 입니다.
2) 단어별로 자를 경우
단어별로 자르고 싶을 경우에는 separator
(첫번째 파라미터)를 " "
로 설정합니다.
const str = 'red blue black';
const splitArr = str.split(" ");
console.log(splitArr); // ['red', 'blue', 'black']
문자열 'red blue black' 에서 단어별로 자르고 싶다면 " "
를 기준으로 split해줍니다.
문자열을 공백을 기준으로 잘라서 각각의 조각들을 배열에 저장하여 리턴합니다.
안에 공백(space)를 반드시 입력해야 합니다.
3) 글자별로 자를 경우
글자별로 자르고 싶을 경우에는 separator
(첫번째 파라미터)를 ""
로 설정합니다.
const str = 'red blue black';
const splitArr = str.split("");
console.log(splitArr); // ['r', 'e', 'd', ' ', 'b', 'l', 'u', 'e', ' ', 'b', 'l', 'a', 'c', 'k']
위 예시와 다르게 첫번째 파라미터 ""
안에 공백을 넣지 않는다면
문자열을 각각의 문자별로 잘라서 한 글자씩 배열에 저장하여 리턴하게 됩니다.
이때 공백도 하나의 문자이기 때문에 공백이 포함되어있습니다.
4) 특정 구분자로 자를 경우
특정 구분자로 자르고 싶을 경우에는 separator
(첫번째 파라미터)를 "특정문자"
로 설정합니다.
const str = "red/blue/black";
const splitArr = str.split("/");
console.log(splitArr); // ['red', 'blue', 'black']
특정 구분자로 자를 경우 첫번째 파라미터 separator
에 자신이 원하는 문자열을 지정합니다.
위 예시에서는 ' / '
를 기준으로 하여, ' / '
를 기준으로 잘라진 조각들을 배열에 담아 리턴하였습니다.
5) limit 값을 지정한 경우
마지막으로 두번째 파라미터인 limit의 값을 지정해보겠습니다.
const str = "red/blue/black";
const splitArr = str.split("/", 2);
console.log(splitArr); // ['red', 'blue']
console.log(splitArr[2]); // undefined
위 예제에서는 limit의 값을 2로 지정했습니다.
' / '
를 기준으로 잘랐지만 배열의 길이가 2로 지정됐기 때문에 black은 배열에 포함되어있지 않습니다.
따라서 arr의 3번째 요소를 콘솔에 찍으면 undefined
가 출력됩니다.
문자열을 원하는 문자로 자르고 그 문자를 내가 원하는 문자(혹은 숫자)로 바꾸고 싶다면
split을 사용해 자른 후 join을 사용해 연결할 수 있습니다.
다음 글에서는 javascript에서 join을 사용하는 것에 대해 알아보겠습니다 !
'FRONTEND > JavaScript' 카테고리의 다른 글
[JavaScript] repeat 함수 - 문자열 일정하게 반복하기 (0) | 2022.08.16 |
---|---|
[JavaScript] join()을 사용해 배열을 하나의 문자열로 만들기 (0) | 2022.08.12 |
[JavaScript] array every, some (0) | 2022.06.22 |
[JavaScript] filter 사용하기 (0) | 2022.06.13 |
[JavaScript] 비구조화 할당 (0) | 2022.06.10 |