path: root/files/ko/web/javascript/reference/global_objects/string/split/index.html

---
title: String.prototype.split()
slug: Web/JavaScript/Reference/Global_Objects/String/split
tags:
  - JavaScript
  - Method
  - Prototype
  - Reference
  - String
translation_of: Web/JavaScript/Reference/Global_Objects/String/split
---
<div>{{JSRef}}</div>

<p><strong><code>split()</code></strong> 메서드는 {{jsxref("String")}} 객체를 지정한 구분자를 이용하여 여러 개의 문자열로 나눕니다.</p>

<div>{{EmbedInteractiveExample("pages/js/string-split.html")}}</div>



<h2 id="구문">구문</h2>

<pre class="syntaxbox"><var>str</var>.split([<var>separator</var>[, <var>limit</var>]])</pre>

<div class="warning">
<p><strong>주의:</strong> 구분자로 빈 문자열(<code>""</code>)을 제공하면, 사용자가 인식하는 문자 하나(<a href="https://unicode.org/reports/tr29/#Grapheme_Cluster_Boundaries">grapheme cluster</a>) 또는 유니코드 문자(코드포인트) 하나씩으로 나누는 것이 아니라, UTF-16 코드유닛으로 나누게 되며 <a href="http://unicode.org/faq/utf_bom.html#utf16-2">써로게이트 페어</a><sup>surrogate pair</sup>가 망가질 수 있습니다. 스택 오버플로우의 <a href="https://stackoverflow.com/a/34717402">How do you get a string to a character array in JavaScript?</a> 질문도 참고해 보세요.</p>
</div>

<h3 id="매개변수">매개변수</h3>

<dl>
 <dt><code>separator</code> {{optional_inline}}</dt>
 <dd>원본 문자열을 끊어야 할 부분을 나타내는 문자열을 나타냅니다. 실제 문자열이나 {{jsxref("Global_Objects/RegExp", "정규표현식", "", 1)}}을 받을 수 있습니다. 문자열 유형의 <code>separator</code>가 두 글자 이상일 경우 그 부분 문자열 전체가 일치해야 끊어집니다. <code>separator</code>가 생략되거나 <code>str</code>에 등장하지 않을 경우, 반환되는 배열은 원본 문자열을 유일한 원소로 가집니다. <code>separator</code>가 빈 문자열일 경우 <code>str</code>의 각각의 문자가 배열의 원소 하나씩으로 변환됩니다.</dd>
 <dt><code>limit</code> {{optional_inline}}</dt>
 <dd>
 <p>끊어진 문자열의 최대 개수를 나타내는 정수입니다. 이 매개변수를 전달하면 split() 메서드는 주어진 <code>separator</code>가 등장할 때마다 문자열을 끊지만 배열의 원소가 <code>limit</code>개가 되면 멈춥니다. 지정된 한계에 도달하기 전에 문자열의 끝까지 탐색했을 경우 <code>limit</code>개 미만의 원소가 있을 수도 있습니다. 남은 문자열은 새로운 배열에 포함되지 않습니다.</p>
 </dd>
</dl>

<h3 id="반환값">반환값</h3>

<p>주어진 문자열을 <code>separator</code>마다 끊은 부분 문자열을 담은 {{jsxref("Array")}}.</p>

<h2 id="설명">설명</h2>

<p>문자열에서 <code>separator</code>가 등장하면 해당 부분은 삭제되고 남은 문자열이 배열로 반환됩니다. <code>separator</code>가 등장하지 않거나 생략되었을 경우 배열은 원본 문자열을 유일한 원소로 가집니다. <code>separator</code>가 빈 문자열일 경우, <code>str</code>은 문자열의 모든 문자를 원소로 가지는 배열로 변환됩니다. <code>separator</code>가 원본 문자열의 처음이나 끝에 등장할 경우 반환되는 배열도 빈 문자열로 시작하거나 끝납니다. 그러므로 원본 문자열에 <code>separator</code> 하나만이 포함되어 있을 경우 빈 문자열 두 개를 원소로 가지는 배열이 반환됩니다.</p>

<p><code>separator</code>가 포획 괄호<sup>capturing parentheses</sup>를 포함하는 정규표현식일 경우, <code>separator</code>가 일치할 때마다 포획 괄호의 (정의되지 않은 경우도 포함한) 결과가 배열의 해당 위치에 포함됩니다.</p>

<p>{{Note("<code>separator</code>가 배열일 경우 분할에 사용하기 전에 우선 문자열로 변환됩니다.")}}</p>

<h2 id="예제">예제</h2>

<h3 id="split()_사용하기"><code>split()</code> 사용하기</h3>

<p>{{Note("빈 문자열이 주어졌을 경우 <code>split()</code>은 빈 배열이 아니라 빈 문자열을 포함한 배열을 반환합니다. 문자열과 <code>separator</code>가 모두 빈 문자열일 때는 빈 배열을 반환합니다.")}}</p>

<pre class="brush: js">const myString = '';
const splits = myString.split();

console.log(splits);

// ↪ [""]
</pre>

<p>다음 예제에서는 문자열을 주어진 구분자로 끊는 함수를 정의합니다. 문자열을 끊은 다음에는 (끊기 이전의) 원본 문자열과 사용한 구분자, 배열의 길이와 각 원소를 로그로 출력합니다.</p>

<pre class="brush: js">function splitString(stringToSplit, separator) {
  var arrayOfStrings = stringToSplit.split(separator);

  console.log('The original string is: "' + stringToSplit + '"');
  console.log('The separator is: "' + separator + '"');
  console.log('The array has ' + arrayOfStrings.length + ' elements: ' + arrayOfStrings.join(' / '));
}

var tempestString = 'Oh brave new world that has such people in it.';
var monthString = 'Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec';

var space = ' ';
var comma = ',';

splitString(tempestString, space);
splitString(tempestString);
splitString(monthString, comma);
</pre>

<p>위 예제의 출력은 다음과 같습니다.</p>

<pre>The original string is: "Oh brave new world that has such people in it."
The separator is: " "
The array has 10 elements: Oh / brave / new / world / that / has / such / people / in / it.

The original string is: "Oh brave new world that has such people in it."
The separator is: "undefined"
The array has 1 elements: Oh brave new world that has such people in it.

The original string is: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"
The separator is: ","
The array has 12 elements: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec
</pre>

<h3 id="문자열에서_공백_제거하기">문자열에서 공백 제거하기</h3>

<p>다음 예제에서 <code>split()</code>은 세미콜론 앞뒤에 각각 0개 이상의 공백이 있는 부분 문자열을 찾고, 있을 경우 문자열에서 세미콜론과 공백을 제거합니다. <code>split()</code>의 결과로 반환된 배열은  <code>nameList</code>에 저장됩니다.</p>

<pre class="brush: js">var names = 'Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ';

console.log(names);

var re = /\s*(?:;|$)\s*/;
var nameList = names.split(re);

console.log(nameList);
</pre>

<p>위 예제는 원본 문자열과 반환된 배열을 각각 한 줄씩 로그로 출력합니다.</p>

<pre>Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand
[ "Harry Trump", "Fred Barney", "Helen Rigby", "Bill Abel", "Chris Hand", "" ]
</pre>

<h3 id="끊는_횟수_제한하기">끊는 횟수 제한하기</h3>

<p>다음 예제에서 <code>split()</code>은 문자열을 공백으로 끊고 처음 3개의 문자열을 반환합니다.</p>

<pre class="brush: js">var myString = 'Hello World. How are you doing?';
var splits = myString.split(' ', 3);

console.log(splits);
</pre>

<p>위 예제의 로그 출력은 다음과 같습니다.</p>

<pre>["Hello", "World.", "How"]
</pre>

<h3 id="RegExp를_사용해_구분자도_결과에_포함하기"><code>RegExp</code>를 사용해 구분자도 결과에 포함하기</h3>

<p><code>separator</code>가 포획 괄호 <code>()</code>를 포함하는 정규표현식일 경우, 포획된 결과도 배열에 포함됩니다.</p>

<pre class="brush: js">var myString = 'Hello 1 word. Sentence number 2.';
var splits = myString.split(/(\d)/);

console.log(splits);
</pre>

<p>위 예제의 로그 출력은 다음과 같습니다.</p>

<pre>[ "Hello ", "1", " word. Sentence number ", "2", "." ]
</pre>

<h3 id="배열을_구분자로_사용하기">배열을 구분자로 사용하기</h3>

<pre class="brush: js">var myString = 'this|is|a|Test';
var splits = myString.split(['|']);

console.log(splits); //["this", "is", "a", "Test"]

var myString = 'ca,bc,a,bca,bca,bc';

var splits = myString.split(['a','b']);
// <em>myString.split(['a','b'])</em>은 <em>myString.split(String(['a','b']))</em>와 같다

console.log(splits);  //["c", "c,", "c", "c", "c"]
</pre>

<h3 id="split()으로_문자열_뒤집기"><code>split()</code>으로 문자열 뒤집기</h3>

<div class="warning">
<p>이 방법은 문자열 뒤집기에 효과적인 방법이 아닙니다.</p>

<pre class="brush: js">var str = 'asdfghjkl';
var strReverse = str.split('').reverse().join(''); // 'lkjhgfdsa'
// split()에서 반환한 배열에는 reverse()와 join()을 사용할 수 있다
</pre>

<p>문자열에 grapheme clusters가 있을 경우, 유니코드 플래그를 설정해도 오류를 일으킵니다(<a href="https://github.com/mathiasbynens/esrever">esrever</a> 등의 라이브러리를 대신 사용하세요).</p>

<pre class="brush: js">var str = 'résumé';
var strReverse = str.split(/(?:)/u).reverse().join('');
// =&gt; "́emuśer"
</pre>

<p><strong>추가:</strong> {{jsxref("Operators/Comparison_Operators", "===", "#Identity_strict_equality_(===)")}} 연산자를 사용하면 원본 문자열이 팰린드롬인지 확인할 수 있습니다.</p>
</div>

<h2 id="명세">명세</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">명세</th>
   <th scope="col">상태</th>
   <th scope="col">비고</th>
  </tr>
  <tr>
   <td>{{SpecName('ES3')}}</td>
   <td>{{Spec2('ES3')}}</td>
   <td>초기 정의. JavaScript 1.1에 구현되었음.</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-15.5.4.14', 'String.prototype.split')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-string.prototype.split', 'String.prototype.split')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-string.prototype.split', 'String.prototype.split')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="브라우저_호환성">브라우저 호환성</h2>

<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>

<p>{{Compat("javascript.builtins.String.split")}}</p>

<h2 id="같이_보기">같이 보기</h2>

<ul>
 <li>{{jsxref("String.prototype.charAt()")}}</li>
 <li>{{jsxref("String.prototype.indexOf()")}}</li>
 <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
 <li>{{jsxref("Array.prototype.join()")}}</li>
</ul>