aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/javascript/reference/statements/label/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ko/web/javascript/reference/statements/label/index.html')
-rw-r--r--files/ko/web/javascript/reference/statements/label/index.html241
1 files changed, 241 insertions, 0 deletions
diff --git a/files/ko/web/javascript/reference/statements/label/index.html b/files/ko/web/javascript/reference/statements/label/index.html
new file mode 100644
index 0000000000..49d6054031
--- /dev/null
+++ b/files/ko/web/javascript/reference/statements/label/index.html
@@ -0,0 +1,241 @@
+---
+title: label
+slug: Web/JavaScript/Reference/Statements/label
+translation_of: Web/JavaScript/Reference/Statements/label
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>레이블 구문</strong>은 {{jsxref("Statements/break", "break")}}나 {{jsxref("Statements/continue", "continue")}} 구문과 함께 사용할 수 있다. 원하는 식별자로 구문 앞에 레이블을 추가할 수 있다.</p>
+
+<div class="note">
+<p>레이블을 붙인 반복문이나 블록가 자주 사용되는 것은 아니다. 반복문으로 점프하는 대신에 함수를 호출할 수도 있다.</p>
+</div>
+
+<h2 id="문법">문법</h2>
+
+<pre class="syntaxbox"><em>label</em> :
+ <em>statement</em>
+</pre>
+
+<dl>
+ <dt><code>label</code></dt>
+ <dd>자바스크립트에서 사용할 수 있는 식별자면 모두 가능하다.</dd>
+ <dt><code>statement</code></dt>
+ <dd>구문. break는 모든 레이블 구문에서 사용될 수 있으며, continue는 반복 레이블 구문에서만 사용할 수 있다.</dd>
+</dl>
+
+<h2 id="설명">설명</h2>
+
+<p>반복문에 레이블을 붙이고, break나 continue 구문을 사용해 반복문의 어느 위치에서 작업을 멈추고 어느 위치에서 다시 수행할지를 알려줄 수 있다.</p>
+
+<p>자바스크립트에는 goto 구문이 없다는 것에 주의. break나 continue에서만 레이블을 사용할 수 있다.</p>
+
+<p><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">strict mode</a>  코드에서 "let"을 레이블 이름으로 사용할 수 없다. {{jsxref("SyntaxError")}}를 발생시킨다. (let은 허용되지 않는 식별자이다.)</p>
+
+<h2 id="예제">예제</h2>
+
+<h3 id="for문에서_레이블_continue_사용하기">for문에서 레이블 continue 사용하기</h3>
+
+<pre class="brush: js">var i, j;
+
+loop1:
+for (i = 0; i &lt; 3; i++) { //첫번째 for문은 "loop1" 레이블을 붙였다.
+ loop2:
+ for (j = 0; j &lt; 3; j++) { //두번째 for문은 "loop2" 레이블을 붙였다.
+ if (i === 1 &amp;&amp; j === 1) {
+ continue loop1;
+ }
+ console.log('i = ' + i + ', j = ' + j);
+ }
+}
+
+// 출력 결과:
+// "i = 0, j = 0"
+// "i = 0, j = 1"
+// "i = 0, j = 2"
+// "i = 1, j = 0"
+// "i = 2, j = 0"
+// "i = 2, j = 1"
+// "i = 2, j = 2"
+// 다음 두 경우를 어떻게 스킵하는지 주목 : "i = 1, j = 1", "i = 1, j = 2"
+</pre>
+
+<h3 id="레이블_continue문_사용하기">레이블 continue문 사용하기</h3>
+
+<p>items, tests 배열을 보면 이 예제는 tests를 통과하는 items의 수를 세고 있다.</p>
+
+<pre class="brush: js">var itemsPassed = 0;
+var i, j;
+
+top:
+for (i = 0; i &lt; items.length; i++) {
+ for (j = 0; j &lt; tests.length; j++) {
+ if (!tests[j].pass(items[i])) {
+ continue top;
+ }
+ }
+
+ itemsPassed++;
+}</pre>
+
+<h3 id="for문에_레이블_break문_사용하기">for문에 레이블 break문 사용하기</h3>
+
+<pre class="brush: js">var i, j;
+
+loop1:
+for (i = 0; i &lt; 3; i++) { //The first for statement is labeled "loop1"
+ loop2:
+ for (j = 0; j &lt; 3; j++) { //The second for statement is labeled "loop2"
+ if (i === 1 &amp;&amp; j === 1) {
+ break loop1;
+ }
+ console.log('i = ' + i + ', j = ' + j);
+ }
+}
+
+// Output is:
+// "i = 0, j = 0"
+// "i = 0, j = 1"
+// "i = 0, j = 2"
+// "i = 1, j = 0"
+// Notice the difference with the previous continue example</pre>
+
+<h3 id="레이블_break문_사용하기">레이블 break문 사용하기</h3>
+
+<p>items, tests 배열을 보면, 다음 예제는 items가 tests를 모두 통과하는지 판단한다.</p>
+
+<pre class="brush: js">var allPass = true;
+var i, j;
+
+top:
+for (i = 0; items.length; i++)
+ for (j = 0; j &lt; tests.length; i++)
+ if (!tests[j].pass(items[i])) {
+ allPass = false;
+ break top;
+ }</pre>
+
+<h3 id="레이블_붙인_블록에_break_사용하기">레이블 붙인 블록에 break 사용하기</h3>
+
+<p>간단한 블록에도 레이블을 사용할 수 있지만, 반복문 아닌 레이블에는 break문만 사용할 수 있다.</p>
+
+<pre class="brush: js">foo: {
+ console.log('face');
+ break foo;
+ console.log('this will not be executed');
+}
+console.log('swap');
+
+// 로그는 이렇게 출력된다:
+
+// "face"
+// "swap </pre>
+
+<h3 id="레이블_붙인_함수_선언문">레이블 붙인 함수 선언문</h3>
+
+<p>ECMAScript 2015에서, 레이블 붙인 함수 선언문은 <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-labelled-function-declarations">web compatibility annex of the specification</a>의 non-strict 모드에서 표준화되어 있다.</p>
+
+<pre class="brush: js">L: function F() {}</pre>
+
+<p><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">strict mode</a>  에서는 {{jsxref("SyntaxError")}}를 발생시킨다.</p>
+
+<pre class="brush: js">'use strict';
+L: function F() {}
+// SyntaxError: functions cannot be labelled</pre>
+
+<p><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">Generator functions</a>는 strict code도 non-strict code에서도 레이블 붙일 수 없다.</p>
+
+<pre class="brush: js">L: function* F() {}
+// SyntaxError: generator functions cannot be labelled
+</pre>
+
+<h2 id="명세">명세</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES3')}}</td>
+ <td>{{Spec2('ES3')}}</td>
+ <td>Initial definition. Implemented in JavaScript 1.2</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES5.1', '#sec-12.12', 'Labelled statement')}}</td>
+ <td>{{Spec2('ES5.1')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES6', '#sec-labelled-statements', 'Labelled statement')}}</td>
+ <td>{{Spec2('ES6')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-labelled-statements', 'Labelled statement')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td> </td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Chrome</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Android</th>
+ <th>Chrome for Android</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="더_알아보기">더 알아보기</h2>
+
+<ul>
+ <li>{{jsxref("Statements/break", "break")}}</li>
+ <li>{{jsxref("Statements/continue", "continue")}}</li>
+</ul>