String.prototype.split() 사용법

split() 함수는
문자열을 주어진 문자열 구분자나 정규식을 기준으로 나누어 배열로 변환하는 함수입니다.

이 함수는 특히 문자열 분리, URL 분석 등의 작업에서 유용하게 사용됩니다.

JavaScript 
/* 특정 구분자를 사용한 문자열 분리 */
const sentence = "자바스크립트는 클라이언트 측 스크립팅 언어입니다.";
const wordsArray = sentence.split(" "); // 공백을 기준으로 문자열을 배열로 나눔

console.log(wordsArray);
// 출력: ["자바스크립트는", "클라이언트", "측", "스크립팅", "언어입니다."]


/* 정규식을 사용한 문자열 분리 */
const str = "This is an example.";
const words = str.split(/\s+/); // 문자열을 공백을 나타내는 정규식(/\s+/)으로 나누어 배열로 변환

console.log(words[0]); // 출력: "This"
console.log(words[1]); // 출력: "is"
console.log(words[2]); // 출력: "an"
console.log(words[3]); // 출력: "example."

/* URL 분석 */
const url = "https://www.example.com/path/to/file.html?param=value";

const parts = url.split("?"); // URL을 구분자로 나누어 배열로 변환

console.log(parts[0]); // 출력: "https://www.example.com/path/to/file.html"
console.log(parts[1]); // 출력: "param=value"

split() 함수의 형식은 다음과 같습니다.

구문

JavaScript 
str.split(separator, limit)

str은 split() 함수를 적용할 원본 문자열입니다.

매개변수

문자열 split() 함수의 매개변수
separator 옵션.
문자열을 나눌 때 사용할 구분자입니다. 문자열 또는 정규식으로 지정할 수 있습니다.
limit 옵션.
문자열을 나눌 때 생성되는 배열의 최대 길이를 제한하는 정수입니다.
기본값은 -1입니다. -1이면 구분자를 모두 사용하여 문자열을 나눕니다.
최대 길이를 초과하여 남은 문자열은 반환하는 배열에 포함되지 않습니다.

반환 값

구분자를 기준으로 나뉜 문자열을 요소로 포함하는 배열입니다.

매개변수와 반환 값 예시

매개변수가 없을 경우

separator를 지정하지 않았을 경우 반환되는 배열은 원본 문자열을 유일한 요소로 가집니다.

JavaScript 
const sentence = "반갑습니다. 환영합니다!";
const wordsArray = sentence.split();

console.log(wordsArray);
// 출력: ["반갑습니다. 환영합니다!"]
빈 문자열("")을 구분자로 지정했을 경우

separator를 빈 문자열("")로 지정하면 반환되는 배열은 원본 문자의 모든 문자를 요소로 가집니다.

JavaScript 
const sentence = "반갑습니다. 환영합니다!";
const wordsArray = sentence.split("");

console.log(wordsArray);
// 출력: ["반", "갑", "습", "니", "다", ".", " ", "환", "영", "합", "니", "다", "!"]
구분자가 원본 문자열의 처음이나 끝에 있는 경우

separator로 지정한 구분자가 원본 문자열의 처음이나 끝에 있는 경우에 반환되는 배열도 빈 문자열로 시작하거나 끝납니다.

JavaScript 구분자가 원본 문자열의 처음에 있는 경우 
const sentence = ",반갑습니다. 환영합니다!";

// 원본 문자열의 처음에 있는 ","를 구분자로 지정합니다.
const wordsArray = sentence.split(",");

// 반환하는 배열의 처음에 빈 문자열("")이 요소로 포함되어 있습니다.
console.log(wordsArray);
// 출력: ["", "반갑습니다. 환영합니다!"]
JavaScript 구분자가 원본 문자열의 끝에 있는 경우 
const sentence = "반갑습니다. 환영합니다!,";

// 원본 문자열의 끝에 있는 ","를 구분자로 지정합니다.
const wordsArray = sentence.split(",");

// 반환하는 배열의 끝에 빈 문자열("")이 요소로 포함되어 있습니다.
console.log(wordsArray);
// 출력: ["반갑습니다. 환영합니다!", ""]
JavaScript 구분자가 원본 문자열의 처음과 끝에 있는 경우 
const sentence = ",반갑습니다. 환영합니다!,";

// 원본 문자열의 처음과 끝에 있는 ","를 구분자로 지정합니다.
const wordsArray = sentence.split(",");

// 반환하는 배열의 처음과 끝에 빈 문자열("")이 요소로 포함되어 있습니다.
console.log(wordsArray);
// 출력: ["", "반갑습니다. 환영합니다!", ""]
구분자와 원본 문자열이 동일할 경우

구분자와 원본 문자열이 동일할 경우 빈 문자열("") 두 개를 요소로 가지는 배열이 반환됩니다.

JavaScript 
const sentence = "반";
const wordsArray = sentence.split("반");

console.log(wordsArray);
// 출력: ["", ""]
구분자와 원본 문자열이 모두 빈 문자열("")일 경우

구분자와 원본 문자열이 모두 빈 문자열("")일 경우 빈 배열이 반환됩니다.

JavaScript 
const sentence = "";
const wordsArray = sentence.split("");

console.log(wordsArray);
// 출력: []

활용 예제

split() 함수는 다양한 상황에서 유용하게 활용될 수 있습니다. 여기에는 몇 가지 예제를 다룹니다.

문자열을 단어로 나누기

JavaScript 
const str = "This is an example.";
const words = str.split(" ");

console.log(words);
// 출력: ["This", "is", "an", "example."]

문자열 파싱하기

JavaScript 
const time = "02:30:45";
const timeParts = time.split(":");
const hours = timeParts[0];

console.log("Hours:", hours);
// 출력: "Hours: 02"

파일 경로에서 파일 이름 추출하기

JavaScript 
const filePath = "/path/to/file.txt";

/* "/"로 나누고 배열의 마지막 요소를 pop() 함수로 반환 */
const fileName = filePath.split('/').pop();

console.log(fileName);
// 출력: "file.txt"

코드 부연설명
pop() 함수는 배열의 맨 마지막 끝의 요소를 제거하는 함수입니다.
제거된 요소를 반환합니다.

이메일 주소에서 도메인 추출하기

JavaScript 
const email = "user@example.com";
const parts = email.split("@");

const domain = parts[1];

console.log(domain);
// 출력 "example.com"

브라우저 호환성

문자열 split() 함수의 브라우저 호환성
메서드
데스크탑 Chrome
Chrome
데스크탑데스크탑 Edge
Edge
데스크탑 Firefox
Firefox
Safari
Safari
split() 1 12 1 1

caniuse.com에서 더 자세한 정보를 확인해 보세요.

명세서

문자열 split() 함수의 명세서 사양
명세서 사양
split() ECMAScript Language Specification
#sec-string.prototype.split

참고문헌

같이 보기