1 files changed, 190 insertions, 0 deletions
diff --git a/files/ko/web/javascript/reference/global_objects/string/substring/index.html b/files/ko/web/javascript/reference/global_objects/string/substring/index.html
new file mode 100644
index 0000000000..91d13974c9
--- /dev/null
+++ b/files/ko/web/javascript/reference/global_objects/string/substring/index.html
@@ -0,0 +1,190 @@
+---
+title: String.prototype.substring()
+slug: Web/JavaScript/Reference/Global_Objects/String/substring
+translation_of: Web/JavaScript/Reference/Global_Objects/String/substring
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>substring()</code></strong><font><font>메소드는 string 객체의 시작 인덱스로 부터 종료 인덱스 전 까지 문자열의 부분 문자열을 반환합니다. </font></font></p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-substring.html")}}</div>
+
+
+
+<h2 id="사용방법">사용방법 </h2>
+
+<pre class="syntaxbox"><code><var>str</var>.substring(<var>indexStart</var>[, <var>indexEnd</var>])</code></pre>
+
+<h3 id="인자값">인자값</h3>
+
+<dl>
+ <dt><code><var>indexStart</var></code></dt>
+ <dd>반환문자열의 시작 인덱스 </dd>
+ <dt> </dt>
+ <dt><code><var>indexEnd</var></code></dt>
+ <dd>옵션.  반환문자열의 마지막 인덱스 (포함하지 않음.)</dd>
+</dl>
+
+<h3 id="반환값">반환값</h3>
+
+<p>기존문자열의  부분 문자열을 반환합니다. </p>
+
+<h2 id="Description">Description</h2>
+
+<p><code>substring()</code> 메서드는 <code><var>indexStart</var></code> 부터 문자를 추출하지만 <code><var>indexEnd</var></code> 가 포함되지 않아도 괜찮습니다. 특징은 아래와 같습니다.</p>
+
+<ul>
+ <li>만약 <code><var>indexEnd</var></code> 가 생략된 경우, <code>substring()</code> 문자열의 끝까지 모든 문자를 추출합니다.</li>
+ <li>만약 <code><var>indexStart</var></code> 가 <code><var>indexEnd</var></code>와 같을 경우, <code>substring()</code> 빈 문자열을 반환합니다.</li>
+ <li>만약 <code><var>indexStart</var></code> 가 <code><var>indexEnd</var></code>보다 큰 경우, <code>substring()</code> 메서드는 마치 두 개의 인자를 바꾼 듯 작동하게 됩니다. 아래 예제를 보세요.</li>
+</ul>
+
+<p>0보다 작은 인자 값을 가지는 경우에는 0으로, <code>stringName.length</code> 보다 큰 인자 값을 가지는 경우, <code>stringName.length</code> 로 처리됩니다. {{jsxref("NaN")}} 값은 0으로 처리됩니다.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_substring()">Using <code>substring()</code></h3>
+
+<p>The following example uses <code>substring()</code> to display characters from the string <code>'Mozilla'</code>:</p>
+
+<pre class="brush: js">var anyString = 'Mozilla';
+
+// Displays 'M'
+console.log(anyString.substring(0, 1));
+console.log(anyString.substring(1, 0));
+
+// Displays 'Mozill'
+console.log(anyString.substring(0, 6));
+
+// Displays 'lla'
+console.log(anyString.substring(4));
+console.log(anyString.substring(4, 7));
+console.log(anyString.substring(7, 4));
+
+// Displays 'Mozilla'
+console.log(anyString.substring(0, 7));
+console.log(anyString.substring(0, 10));
+</pre>
+
+<h3 id="Using_substring()_with_length_property">Using <code>substring()</code> with <code>length</code> property</h3>
+
+<p>The following example uses the <code>substring()</code> method and {{jsxref("String.length", "length")}} property to extract the last characters of a particular string. This method may be easier to remember, given that you don't need to know the starting and ending indices as you would in the above examples.</p>
+
+<pre class="brush: js">// Displays 'illa' the last 4 characters
+var anyString = 'Mozilla';
+var anyString4 = anyString.substring(anyString.length - 4);
+console.log(anyString4);
+
+// Displays 'zilla' the last 5 characters
+var anyString = 'Mozilla';
+var anyString5 = anyString.substring(anyString.length - 5);
+console.log(anyString5);
+</pre>
+
+<h3 id="The_difference_between_substring()_and_substr()">The difference between <code>substring()</code> and <code>substr()</code></h3>
+
+<p>There's a subtle difference between the <code>substring()</code> and {{jsxref("String.substr", "substr()")}} methods, so you should be careful not to get them confused.</p>
+
+<p>The arguments of <code>substring()</code> represent the starting and ending indexes, while the arguments of <code>substr()</code> represent the starting index and the number of characters to include in the returned string.</p>
+
+<pre class="brush: js">var text = 'Mozilla';
+console.log(text.substring(2,5)); // =&gt; "zil"
+console.log(text.substr(2,3));    // =&gt; "zil"</pre>
+
+<h3 id="Differences_between_substring()_and_slice()">Differences between <code>substring()</code> and <code>slice()</code></h3>
+
+<p>The <code>substring()</code> and {{jsxref("String.slice", "slice()")}} methods are almost identical, but there are a couple of subtle differences between the two, especially in the way negative arguments are dealt with.</p>
+
+<p>The <code>substring()</code> method swaps its two arguments if <code><var>indexStart</var></code> is greater than <code><var>indexEnd</var></code>, meaning that a string is still returned. The {{jsxref("String.slice", "slice()")}} method returns an empty string if this is the case.</p>
+
+<pre class="brush: js">var text = 'Mozilla';
+console.log(text.substring(5, 2)); // =&gt; "zil"
+console.log(text.slice(5, 2));     // =&gt; ""
+</pre>
+
+<p>If either or both of the arguments are negative or <code>NaN</code>, the <code>substring()</code> method treats them as if they were <code>0</code>.</p>
+
+<pre class="brush: js">console.log(text.substring(-5, 2)); // =&gt; "Mo"
+console.log(text.substring(-5, -2)); // =&gt; ""
+</pre>
+
+<p><code>slice()</code> also treats <code>NaN</code> arguments as <code>0</code>, but when it is given negative values it counts backwards from the end of the string to find the indexes.</p>
+
+<pre class="brush: js">console.log(text.slice(-5, 2)); // =&gt; ""
+console.log(text.slice(-5, -2)); // =&gt; "zil"
+</pre>
+
+<p>See the {{jsxref("String.slice", "slice()")}} page for more examples with negative numbers.</p>
+
+<h3 id="Replacing_a_substring_within_a_string">Replacing a substring within a string</h3>
+
+<p>The following example replaces a substring within a string. It will replace both individual characters and substrings. The function call at the end of the example changes the string <code>Brave New World</code> to <code>Brave New Web</code>.</p>
+
+<pre class="brush: js">// Replaces oldS with newS in the string fullS
+function replaceString(oldS, newS, fullS) {
+  for (var i = 0; i &lt; fullS.length; ++i) {
+    if (fullS.substring(i, i + oldS.length) == oldS) {
+      fullS = fullS.substring(0, i) + newS + fullS.substring(i + oldS.length, fullS.length);
+    }
+  }
+  return fullS;
+}
+
+replaceString('World', 'Web', 'Brave New World');
+</pre>
+
+<p>Note that this can result in an infinite loop if <code>oldS</code> is itself a substring of <code>newS</code> — for example, if you attempted to replace 'World' with 'OtherWorld' here. A better method for replacing strings is as follows:</p>
+
+<pre class="brush: js">function replaceString(oldS, newS, fullS) {
+  return fullS.split(oldS).join(newS);
+}
+</pre>
+
+<p>The code above serves as an example for substring operations. If you need to replace substrings, most of the time you will want to use {{jsxref("String.prototype.replace()")}}.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.substring', 'String.prototype.substring')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.substring', 'String.prototype.substring')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.15', 'String.prototype.substring')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Implemented in JavaScript 1.0.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</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.substring")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.substr()")}} {{deprecated_inline}}</li>
+ <li>{{jsxref("String.prototype.slice()")}}</li>
+</ul>