initial commit

2 files changed, 389 insertions, 0 deletions

diff --git a/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/index.html b/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/index.html
new file mode 100644
index 0000000000..0758e1332b
--- /dev/null
+++ b/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/index.html
@@ -0,0 +1,303 @@
+---
+title: Intl.DateTimeFormat
+slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+tags:
+  - DateTimeFormat
+  - Internationalization
+  - Intl
+  - JavaScript
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary"><strong><code>Intl.DateTimeFormat</code></strong>은 언어에 맞는 날짜 및 시간 서식을 지원하는 객체의 생성자입니다.</span> <code>dateStyle</code>과 <code>timeStyle</code> 옵션을 통해 날짜와 시간 형식을 빠르게 맞출 수 있고, 더 자세한 조정을 위한 다른 옵션도 존재합니다.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/intl-datetimeformat.html")}}</div>
+
+
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox">new Intl.DateTimeFormat([<var>locales</var>[, <var>options</var>]])
+Intl.DateTimeFormat.call(<var>this</var>[, <var>locales</var>[, <var>options</var>]])</pre>
+
+<h3 id="매개변수">매개변수</h3>
+
+<dl>
+ <dt><code>locales</code> {{optional_inline}}</dt>
+ <dd>
+ <p><a href="https://ko.wikipedia.org/wiki/IETF_%EC%96%B8%EC%96%B4_%ED%83%9C%EA%B7%B8">BCP 47</a> 언어 태그를 포함하는 문자열이나 문자열의 배열. 로케일 매개변수의 일반적인 형식 및 해석은 {{jsxref("Intl", "<code>Intl</code> 문서", "#Locale_identification_and_negotiation", 1)}}를 참고하세요. 다음의 유니코드 확장 키를 사용할 수 있습니다.</p>
+
+ <dl>
+  <dt><code>nu</code></dt>
+  <dd>사용할 기수법. <code>"arab"</code>, <code>"arabext"</code>, <code>"bali"</code>, <code>"beng"</code>, <code>"deva"</code>, <code>"fullwide"</code>, <code>"gujr"</code>, <code>"guru"</code>, <code>"hanidec"</code>, <code>"khmr"</code>, <code>"knda"</code>, <code>"laoo"</code>, <code>"latn"</code>, <code>"limb"</code>, <code>"mlym"</code>, <code>"mong"</code>, <code>"mymr"</code>, <code>"orya"</code>, <code>"tamldec"</code>, <code>"telu"</code>, <code>"thai"</code>, <code>"tibt"</code> 등을 사용할 수 있습니다.</dd>
+  <dt><code>ca</code></dt>
+  <dd>역법. <code>"buddhist"</code>, <code>"chinese"</code>, <code>"coptic"</code>, <code>"ethioaa"</code>, <code>"ethiopic"</code>, <code>"gregory"</code>, <code>"hebrew"</code>, <code>"indian"</code>, <code>"islamic"</code>, <code>"islamicc"</code>, <code>"iso8601"</code>, <code>"japanese"</code>, <code>"persian"</code>, <code>"roc"</code> 등을 사용할 수 있습니다.</dd>
+  <dt><code>hc</code></dt>
+  <dd>시간 사이클. <code>"h11"</code>, <code>"h12"</code>, <code>"h23"</code>, <code>"h24"</code> 등을 사용할 수 있습니다.</dd>
+ </dl>
+ </dd>
+ <dt><code>options</code> {{optional_inline}}</dt>
+ <dd>
+ <p>다음 속성을 포함하는 객체.</p>
+
+ <dl>
+  <dt><code>dateStyle</code></dt>
+  <dd><code>format()</code>을 호출했을 때 사용할 날짜 서식. 가능한 값은 다음을 포함합니다.
+  <ul>
+   <li><code>"full"</code></li>
+   <li><code>"long"</code></li>
+   <li><code>"medium"</code></li>
+   <li><code>"short"</code></li>
+  </ul>
+  </dd>
+  <dt><code>timeStyle</code></dt>
+  <dd><code>format()</code>을 호출했을 때 사용할 시간 서식. 가능한 값은 다음을 포함합니다.
+  <ul>
+   <li><code>"full"</code></li>
+   <li><code>"long"</code></li>
+   <li><code>"medium"</code></li>
+   <li><code>"short"</code></li>
+  </ul>
+  </dd>
+  <dt><code>localeMatcher</code></dt>
+  <dd>사용할 로케일 매칭 알고리즘. 가능한 값은 <code>"lookup"</code>과 <code>"best fit"</code>이고, 기본값은 <code>"best fit"</code>입니다. 자세한 정보는 {{jsxref("Intl", "<code>Intl</code> 문서", "#로케일_조정", 1)}}를 참고하세요.</dd>
+  <dt><code>timeZone</code></dt>
+  <dd>사용할 시간대. 구현체가 반드시 인식해야 하는 유일한 값은 <code>"UTC"</code>입니다. 기본값은 런타임의 기본 시간대입니다. 구현체에 따라 "<code>Asia/Shanghai</code>", "<code>Asia/Kolkata</code>", "<code>America/New_York</code>" 등 <a href="https://www.iana.org/time-zones">IANA 시간대 데이터베이스</a>의 시간대 이름을 인식할 수도 있습니다.</dd>
+  <dt><code>hour12</code></dt>
+  <dd>24시간제 대신 12시간제를 사용할지 여부. 가능한 값은 <code>true</code> 와 <code>false</code>이고, 기본값은 로케일에 따라 다릅니다. 이 옵션을 지정하면 <code>hc</code> 언어 태그와 <code>hourCycle</code> 옵션을 모두 무시합니다.</dd>
+  <dt><code>hourCycle</code></dt>
+  <dd>사용할 시간제. 가능한 값은 <code>"h11"</code>, <code>"h12"</code>, <code>"h23"</code>, <code>"h24"</code>입니다. 이 옵션을 지정하면 <code>hc</code> 언어 태그를 무시합니다. <code>hour12</code> 옵션을 지정한 경우 그 값이 우선순위를 가집니다.</dd>
+  <dt><code>formatMatcher</code></dt>
+  <dd>사용할 서식 매칭 알고리즘. 가능한 값은 <code>"basic"</code>과 <code>"best fit"</code>이고, 기본값은 <code>"best fit"</code>입니다. 아래의 단락에서 이 속성의 자세한 정보를 확인하세요.</dd>
+ </dl>
+
+ <p>이후의 속성은 서식을 적용한 출력 결과가 사용할 날짜 및 시간 구성요소를 나타냅니다. 구현체는 적어도 아래의 부분집합을 지원해야 합니다.</p>
+
+ <ul>
+  <li><code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code>, <code>hour</code>, <code>minute</code>, <code>second</code></li>
+  <li><code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code></li>
+  <li><code>year</code>, <code>month</code>, <code>day</code></li>
+  <li><code>year</code>, <code>month</code></li>
+  <li><code>month</code>, <code>day</code></li>
+  <li><code>hour</code>, <code>minute</code>, <code>second</code></li>
+  <li><code>hour</code>, <code>minute</code></li>
+ </ul>
+
+ <p>구현체에 따라 다른 집합을 지원할 수도 있습니다. 서식 요청은 가능한 모든 부분집합 조합 중 최적으로 일치하는 집합으로 조정됩니다. 조정 알고리즘에는 <a href="http://www.ecma-international.org/ecma-402/1.0/#BasicFormatMatcher">명세에 완벽히 정의된 <code>basic</code> 알고리즘</a>과, 구현체에 따라 다른 <code>best-fit</code> 알고리즘 두 종류가 있으며 <code>formatMatcher</code> 속성의 값이 어느 쪽을 사용할지 결정합니다.</p>
+
+ <dl>
+  <dt><code>weekday</code></dt>
+  <dd>요일. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>long</code>" (<code>금요일</code>, <code>Thursday</code> 등)</li>
+   <li>"<code>short</code>" (<code>(금)</code>, <code>Thu</code> 등)</li>
+   <li>"<code>narrow</code>" (<code>(금)</code>, <code>T</code> 등). 일부 로케일에서는 두 개의 요일이 같은 값을 스타일을 가질 수 있습니다. (예: <code>Thursday</code>와 <code>Tuesday</code> 둘 다 <code>T</code>)</li>
+  </ul>
+  </dd>
+  <dt><code>era</code></dt>
+  <dd>시대. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>long</code>" (<code>서기</code>, <code>Anno Domini</code> 등)</li>
+   <li>"<code>short</code>" (<code>AD</code> 등)</li>
+   <li>"<code>narrow</code>" (<code>A</code>, <code>AD</code> 등)</li>
+  </ul>
+  </dd>
+  <dt><code>year</code></dt>
+  <dd>연도. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>numeric</code>" (<code>2019년</code>, <code>2019</code> 등)</li>
+   <li>"<code>2-digit</code>" (<code>19년</code>, <code>19</code> 등)</li>
+  </ul>
+  </dd>
+  <dt><code>month</code></dt>
+  <dd>월. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>numeric</code>" (<code>3</code> 등)</li>
+   <li>"<code>2-digit</code>" (<code>03</code> 등)</li>
+   <li>"<code>long</code>" (<code>3월</code>, <code>March</code> 등)</li>
+   <li>"<code>short</code>" (<code>Mar</code> 등)</li>
+   <li>"<code>narrow</code>" (<code>M</code> 등). 일부 로케일에서는 두 개의 요일이 같은 값을 스타일을 가질 수 있습니다. (예: <code>March</code>와 <code>May</code> 둘 다 <code>M</code>)</li>
+  </ul>
+  </dd>
+  <dt><code>day</code></dt>
+  <dd>일. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>numeric</code>" (<code>1</code> 등)</li>
+   <li>"<code>2-digit</code>" (<code>01</code> 등)</li>
+  </ul>
+  </dd>
+  <dt><code>hour</code></dt>
+  <dd>시. 가능한 값은 <code>"numeric"</code>, <code>"2-digit"</code>입니다.</dd>
+  <dt><code>minute</code></dt>
+  <dd>분. 가능한 값은 <code>"numeric"</code>, <code>"2-digit"</code>입니다.</dd>
+  <dt><code>second</code></dt>
+  <dd>초. 가능한 값은 <code>"numeric"</code>, <code>"2-digit"</code>입니다.</dd>
+  <dt><code>timeZoneName</code></dt>
+  <dd>시간대 이름. 가능한 값은 다음과 같습니다.
+  <ul>
+   <li>"<code>long</code>" (<code>한국 표준시</code>, <code>British Summer Time</code>등)</li>
+   <li>"<code>short</code>" (<code>GMT+9</code> 등)</li>
+  </ul>
+  </dd>
+ </dl>
+
+ <p class="noinclude">각 구성요소 속성의 기본값은 {{jsxref("undefined")}}입니다. 그러나 모든 속성이 {{jsxref("undefined")}}일 경우, <code>year</code>, <code>month</code>, <code>day</code>는 <code>"numeric"</code>으로 취급합니다.</p>
+ </dd>
+</dl>
+
+<h2 id="설명">설명</h2>
+
+<h3 id="속성">속성</h3>
+
+<dl>
+ <dt>{{jsxref("DateTimeFormat.prototype", "Intl.DateTimeFormat.prototype")}}</dt>
+ <dd>모든 인스턴스에 속성을 추가할 수 있습니다.</dd>
+</dl>
+
+<h3 id="메서드">메서드</h3>
+
+<dl>
+ <dt>{{jsxref("DateTimeFormat.supportedLocalesOf", "Intl.DateTimeFormat.supportedLocalesOf()")}}</dt>
+ <dd>주어진 로케일 목록 중, 런타임이 지원하는 항목을 배열로 반환합니다.</dd>
+</dl>
+
+<h2 id="DateTimeFormat_인스턴스"><code>DateTimeFormat</code> 인스턴스</h2>
+
+<h3 id="속성_2">속성</h3>
+
+<p><code>DateTimeFormat</code> 인스턴스는 프로토타입의 다음 속성을 상속합니다.</p>
+
+<div>{{page('/ko/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype', '속성')}}</div>
+
+<h3 id="메서드_2">메서드</h3>
+
+<p><code>DateTimeFormat</code> 인스턴스는 프로토타입의 다음 메서드를 상속합니다.</p>
+
+<div>{{page('/ko/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype', '메서드')}}</div>
+
+<h2 id="예제">예제</h2>
+
+<h3 id="DateTimeFormat_사용하기"><code>DateTimeFormat</code> 사용하기</h3>
+
+<p>로케일을 지정하지 않고 사용하면 기본 로케일 및 기본 옵션 서식을 적용한 문자열을 반환합니다.</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// 매개변수 없이 toLocaleString() 호출한 결과는
+// 구현체, 기본 로케일, 기본 시간대에 다라 달라짐
+console.log(new Intl.DateTimeFormat().format(date));
+// → ko-KR 로케일(언어)와 Asia/Seoul 시간대(UTC+0900)에서 "2012. 12. 20."
+</pre>
+
+<h3 id="locales_사용하기"><code>locales</code> 사용하기</h3>
+
+<p>다음 예제는 지역화된 숫자 서식의 예시를 보입니다. 어플리케이션의 사용자 인터페이스 언어에 맞는 서식을 적용하려면 <code>locales</code> 매개변수로 적절한 언어(와, 필요한 경우 대체 언어)를 제공하는걸 잊지 마세요.</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// 아래 결과는 모두 Asia/Seoul 시간대를 사용한 결과 (UTC+0900, 한국 표준시)
+
+// 한국어에서 날짜 표기는 연월일 순서
+console.log(new Intl.DateTimeFormat('ko-KR').format(date));
+// → "2012. 12. 20."
+
+// 미국 영어에서 날짜 표기는 월일년 순서
+console.log(new Intl.DateTimeFormat('en-US').format(date));
+// → "12/20/2012"
+
+// 영국 영어에서 날짜 표기는 일월년 순서
+console.log(new Intl.DateTimeFormat('en-GB').format(date));
+// → "20/12/2012"
+
+// 대부분의 아랍어 국가에서는 진짜 아라비아 숫자 사용
+console.log(new Intl.DateTimeFormat('ar-EG').format(date));
+// → "٢٠‏/١٢‏/٢٠١٢"
+
+// 일본어의 경우 어플리케이션에 연호를 사용해야 할 수도 있음
+// 2012년은 헤이세이 24년
+console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date));
+// → "24/12/20"
+
+// 발리어와 같이 지원되지 않을 수도 있는 언어를 지정할 때는
+// 다음과 같이 대체 언어를 지정할 수 있음. 아래의 경우 대체 언어는 인도어
+console.log(new Intl.DateTimeFormat(['ban', 'id']).format(date));
+// → "20/12/2012"
+</pre>
+
+<h3 id="options_사용하기"><code>options</code> 사용하기</h3>
+
+<p><code>options</code> 매개변수를 지정해 날짜와 시간 서식 결과를 원하는 형태로 바꿀 수 있습니다.</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// 긴 날짜 서식에 더해 요일 요청
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(new Intl.DateTimeFormat('de-DE', options).format(date));
+// → "Donnerstag, 20. Dezember 2012"
+
+// 어플리케이션이 GMT를 사용해야 하고, 그 점을 명시해야 할 때
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(new Intl.DateTimeFormat('en-US', options).format(date));
+// → "Thursday, December 20, 2012, GMT"
+
+// 좀 더 자세한 설정이 필요하면
+options = {
+  hour: 'numeric', minute: 'numeric', second: 'numeric',
+  timeZone: 'Australia/Sydney',
+  timeZoneName: 'short'
+};
+console.log(new Intl.DateTimeFormat('en-AU', options).format(date));
+// → "2:00:00 pm AEDT"
+
+// 미국에서도 24시간제가 필요할 때
+options = {
+  year: 'numeric', month: 'numeric', day: 'numeric',
+  hour: 'numeric', minute: 'numeric', second: 'numeric',
+  hour12: false,
+  timeZone: 'America/Los_Angeles'
+};
+console.log(new Intl.DateTimeFormat('en-US', options).format(date));
+// → "12/19/2012, 19:00:00"
+</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('ES Int 1.0', '#sec-12.1', 'Intl.DateTimeFormat')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-12.1', 'Intl.DateTimeFormat')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#datetimeformat-objects', 'Intl.DateTimeFormat')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Intl.DateTimeFormat")}}</p>
+</div>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<div>{{page('/ko/docs/Web/JavaScript/Reference/Global_Objects/Intl', '같이_보기')}}</div>
diff --git a/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html b/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html
new file mode 100644
index 0000000000..1990621642
--- /dev/null
+++ b/files/ko/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html
@@ -0,0 +1,86 @@
+---
+title: Intl.DateTimeFormat.prototype
+slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/prototype
+tags:
+  - DateTimeFormat
+  - Internationalization
+  - Intl
+  - JavaScript
+  - Property
+  - Prototype
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>Intl.DateTimeFormat.prototype</code></strong> 속성은 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 생성자의 프로토타입을 나타냅니다.</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="설명">설명</h2>
+
+<p><code>Intl.DateTimeFormat</code> 인스턴스에 대한 설명은 {{jsxref("DateTimeFormat")}} 문서를 참고하세요.</p>
+
+<p>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 인스턴스는 <code>Intl.DateTimeFormat.prototype</code>을 상속합니다. 프로토타입 객체를 변경하면 모든 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 인스턴스가 영향을 받습니다.</p>
+
+<h2 id="속성">속성</h2>
+
+<dl>
+ <dt><code>Intl.DateTimeFormat.prototype.constructor</code></dt>
+ <dd>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}에 대한 참조입니다.</dd>
+</dl>
+
+<h2 id="메서드">메서드</h2>
+
+<dl>
+ <dt>{{jsxref("DateTimeFormat.format", "Intl.DateTimeFormat.prototype.format()")}}</dt>
+ <dd>주어진 날짜에 {{jsxref("DateTimeFormat")}} 객체의 로케일과 서식 설정을 적용해 반환합니다.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("DateTimeFormat.formatToParts", "Intl.DateTimeFormat.prototype.formatToParts()")}}</dt>
+ <dd>서식을 적용한 날짜 문자열의 각 부분을 객체로 표현해서 {{jsxref("Array")}}로 반환합니다. 반환 값은 로케일별 커스텀 서식에 사용할 수 있습니다.</dd>
+ <dt>{{jsxref("DateTimeFormat.resolvedOptions", "Intl.DateTimeFormat.prototype.resolvedOptions()")}}</dt>
+ <dd>객체 인스턴스 생성 때 주어진 로케일과 서식 설정이 어떻게 반영되었나 나타내는 새로운 객체를 반환합니다.</dd>
+</dl>
+
+<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('ES Int 1.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype', 'Intl.DateTimeFormat.prototype')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Intl.DateTimeFormat.prototype")}}</p>
+</div>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+</ul>