본 포스팅은 JavaScript에서 문자열을 자르는 방법을 소개합니다.
방법 1. slice() & substring() 메서드
slice() 또는 substring() 메서드를 사용하여 문자열에서 특정 부분만 추출할 수 있다.
str.slice(beginIndex[, endIndex])
str.substring(beginIndex[, endIndex])
- beginIndex: 추출 시작 위치
- endIndex: 추출 종료 위치
특정 위치부터 문자열의 마지막 위치까지 자르고 싶다면 첫 번째 매개변수에 특정 위치(인덱스)를 전달하고 두 번째 매개변수는 생략한다.
slice()
const str = "JavaScript";
const sliceResult = str.slice(4);
console.log(sliceResult); // Script
substring()
const str = "JavaScript";
const substringResult = str.substring(4);
console.log(substringResult); // Script
추출 종료 위치가 시작 위치보다 작거나 동일한 경우 빈 문자열(”)을 반환한다.
slice()
const str = "JavaScript";
const sliceResult = str.slice(4, 4);
console.log(sliceResult === ''); // true
substring()
const str = "JavaScript";
const substringResult = str.substring(4, 4);
console.log(substringResult === ''); // true
slice() & substring() 메서드의 차이점
slice() 메서드의 추출 시작 위치와 추출 종료 위치에는 음수를 전달할 수 있다.
- beginIndex가 음수인 경우: -6인 경우 추출 시작 위치는 (문자열의 길이 – 6)
- endIndex가 음수인 경우: -6인 경우 추출 종료 위치는 (문자열의 길이 – 6)
slice()
const str = "JavaScript";
const sliceResult = str.slice(-6);
console.log(sliceResult); // Script
반면에 substring() 메서드의 매개변수로 음수를 전달하면, 원본 문자열을 반환한다.
substring()
const str = "JavaScript";
const substringResult = str.substringResult(-6);
console.log(substringResult); // JavaScript
방법 2. split() 메서드
split() 메서드는 지정된 구분자를 기준으로 문자열을 분할하여 배열로 반환한다. 분할된 문자열의 각 부분은 배열의 요소가 된다.
다음은 띄어쓰기(” “)를 기준으로 문자열을 분리한다.
const str = "Hello, JavaScript !";
const splitResult = str.split(" ");
console.log(splitResult); // ['Hello,', 'JavaScript', '!']
console.log(splitResult.length); // 3
split() 메서드의 두 번째 매개변수로 정수를 전달하면, 배열의 요소의 길이를 제한할 수 있다.
const str = "Hello, JavaScript !";
const splitResult = str.split(" ", 1);
console.log(splitResult); // ['Hello,']
console.log(splitResult.length); // 1
구분자가 생략되거나 원본 문자열에 구분자가 없는 경우 split() 메서드는 원본 문자열을 첫 번째 요소로 가지는 배열을 반환한다.
const str = "Hello, JavaScript !";
const splitResult = str.split();
console.log(splitResult); // ['Hello, JavaScript !']
console.log(splitResult.length); // 1
방법 3. split() 메서드 + 정규 표현식
split() 메서드에는 문자열뿐만 아니라 정규 표현식도 전달할 수 있다. split() 메서드에 문자열 대신 정규 표현식을 전달하면 구분자를 두 개 이상 설정할 수 있다.
다음 예시는 문자열 “_”(언더스코어), “;”(세미콜론)을 구분자로 설정하고 정규 표현식의 OR 연산자인 “|” 기호를 사용하여 문자열을 분리한다.
const str = "Java_React;C#_Vuejs;Angular";
const splitResult = str.split(/_|;/);
console.log(splitResult); // ['Java', 'React', 'C#', 'Vuejs', 'Angular']
console.log(splitResult.length); // 5