initial commit

31 files changed, 5237 insertions, 0 deletions

diff --git a/files/ja/web/javascript/reference/statements/async_function/index.html b/files/ja/web/javascript/reference/statements/async_function/index.html
new file mode 100644
index 0000000000..4c4032c50d
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/async_function/index.html
@@ -0,0 +1,261 @@
+---
+title: 非同期関数
+slug: Web/JavaScript/Reference/Statements/async_function
+tags:
+  - Example
+  - Function
+  - JavaScript
+  - Language feature
+  - Statement
+  - 文
+  - 言語機能
+  - 関数
+translation_of: Web/JavaScript/Reference/Statements/async_function
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><span class="seoSummary"><code><strong>async function</strong></code> 宣言は、 <strong>非同期関数</strong> — {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}} オブジェクトである関数を定義します。非同期関数は<a href="/ja/docs/Web/JavaScript/EventLoop">イベントループ</a>を介して他のコードとは別に実行され、結果として暗黙の {{jsxref("Promise")}} を返します。ただし、非同期関数を使用したコードの構文および構造は、通常の同期関数と似たものになります。</span></p>
+
+<div class="noinclude">
+<p>{{jsxref("Operators/async_function", "async function 式", "", 1)}} を使用して非同期関数を定義することもできます。</p>
+</div>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-async.html", "taller")}}</div>
+
+<div class="hidden">このインタラクティブデモのソースは GitHub のリポジトリに格納されています。インタラクティブデモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送ってください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">async function <var>name</var>([<var>param</var>[, <var>param</var>[, ...<var>param</var>]]]) {
+   <var>statements</var>
+}
+</pre>
+
+<h3 id="Parameters" name="Parameters">引数</h3>
+
+<dl>
+ <dt><code><var>name</var></code></dt>
+ <dd>関数名。</dd>
+ <dt><code><var>param</var></code></dt>
+ <dd>関数に渡す引数名。</dd>
+ <dt><code><var>statements</var></code></dt>
+ <dd>関数の本体を構成する文。</dd>
+</dl>
+
+<h3 id="Return_value" name="Return_value">返値</h3>
+
+<p>{{jsxref("Promise")}} で、非同期関数から返される値で解決するか、または非同期関数内の捕捉されなかった例外で拒否します。</p>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>非同期関数は、 {{jsxref("Operators/await", "await")}} 式を含むことができます。これは非同期関数の実行を一時停止し、 <code>Promise</code> の解決を待ちます。そして非同期関数の実行を再開し、解決された値を返します。</p>
+
+<p><strong>キーワード <code>await</code> は、非同期関数の中でのみ有効です。</strong>非同期関数の外で使用した場合は {{jsxref("SyntaxError")}} となります。</p>
+
+<p>非同期関数が一時停止している間、呼び出し側の関数は実行が続きます (非同期関数から返される暗黙の Promise を受け取ります)。</p>
+
+<div class="note">
+<p><code>async</code>/<code>await</code> の目的は、 Promise を同期的に使用する動作を簡素化し、 <code>Promise</code> のグループに対して何らかの動作を実行することです。 <code>Promise</code> が構造化コールバックに似ているのと同様に、 <code>async</code>/<code>await</code> はジェネレーターと Promise を組み合わせたものに似ています。</p>
+</div>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Simple_example" name="Simple_example">シンプルな例</h3>
+
+<pre class="brush: js notranslate">function resolveAfter2Seconds() {
+  console.log("starting slow promise")
+  return new Promise(resolve =&gt; {
+    setTimeout(function() {
+      resolve("slow")
+      console.log("slow promise is done")
+    }, 2000)
+  })
+}
+
+function resolveAfter1Second() {
+  console.log("starting fast promise")
+  return new Promise(resolve =&gt; {
+    setTimeout(function() {
+      resolve("fast")
+      console.log("fast promise is done")
+    }, 1000)
+  })
+}
+
+async function sequentialStart() {
+  console.log('==SEQUENTIAL START==')
+
+  // 1. ここは即時実行される
+  const slow = await resolveAfter2Seconds()
+  console.log(slow) // 2. ここは 1. の2秒後に実行される
+
+  const fast = await resolveAfter1Second()
+  console.log(fast) // 3. ここは 1. の3秒後に実行される
+}
+
+async function concurrentStart() {
+  console.log('==CONCURRENT START with await==');
+  const slow = resolveAfter2Seconds() // 即時実行
+  const fast = resolveAfter1Second() // 即時実行
+
+  // 1. ここは即時実行される
+  console.log(await slow) // 2. ここは 1. の2秒後に実行される
+  console.log(await fast) // 3. ここは 1. の2秒後（2.の直後）に実行される
+}
+
+function concurrentPromise() {
+  console.log('==CONCURRENT START with Promise.all==')
+  return Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then((messages) =&gt; {
+    console.log(messages[0]) // slow
+    console.log(messages[1]) // fast
+  })
+}
+
+async function parallel() {
+  console.log('==PARALLEL with await Promise.all==')
+
+  // 2つの jobs を並列に実行し両方が完了するのを待つ
+  await Promise.all([
+      (async()=&gt;console.log(await resolveAfter2Seconds()))(),
+      (async()=&gt;console.log(await resolveAfter1Second()))()
+  ])
+}
+
+// この関数はエラーハンドリングをしていません。後述の注意書きを参照してください。
+function parallelPromise() {
+  console.log('==PARALLEL with Promise.then==')
+  resolveAfter2Seconds().then((message)=&gt;console.log(message))
+  resolveAfter1Second().then((message)=&gt;console.log(message))
+}
+
+sequentialStart() // 2秒後に "slow" をログ出力し、その1秒後に "fast" をログ出力する
+
+// 見やすくするため setTimeout で直前の処理が終わるのを待つ
+setTimeout(concurrentStart, 4000) // 2秒後に "slow" と "fast" をログ出力する
+
+// 直前の処理を待つ
+setTimeout(concurrentPromise, 7000) // concurrentStart と同様
+
+// 直前の処理を待つ
+setTimeout(parallel, 10000) // 本当に並列処理となるため1秒後に "fast" とログ出力し、その1秒後に "slow" とログ出力する
+
+// 直前の処理を待つ
+setTimeout(parallelPromise, 13000) // parallel と同様
+</pre>
+
+<h4 id="await_and_parallelism" name="await_and_parallelism">await と並列性</h4>
+
+<p><code>sequentialStart</code> では、最初の <code>await</code> のために実行が 2 秒間待機し、 2 つ目の <code>await</code> のためにさらに 1 秒間待機します。 2 つ目のタイマーは最初のタイマーが起動している間は作成されません。コードは 3 秒後に終了します。</p>
+
+<p><code>concurrentStart</code> では、両方のタイマーが作成され、両方とも <code>await</code> される、すなわち待機させられます。タイマーは同時に実行されているため、 3 秒後ではなく 2 秒後に、すなわち最も遅いタイマーにあわせて終了します。<br>
+ しかし、 <code>await</code> の呼び出しは依然として逐次処理であり、これは 2 つ目の <code>await</code> が 1 つ目の終了まで待つことを意味します。このケースでは、最も速いタイマーが最も遅いタイマーのあとに処理されることになります。</p>
+
+<p>もし複数の処理を完全に並列に実行したい場合は、上記コード中の <code>parallel</code> のように <code>await Promise.all([job1(), job2()])</code> を使わなければなりません。</p>
+
+<div class="warning">
+<h4 id="asyncawait_vs_Promise.then_and_error_handling" name="asyncawait_vs_Promise.then_and_error_handling">async/await と Promise.then およびエラー処理</h4>
+
+<p>多くの非同期関数は Promise を用いて通常の関数として書くことができます。しかし <code>async</code> 関数はエラー処理において少し簡単です。</p>
+
+<p><code>concurrentStart</code>と<code>concurrentPromise</code>のどちらも関数としては同値です。</p>
+
+<ul>
+ <li><code>concurrentStart</code> では、 <code>await</code> されたいずれかの関数呼び出しが失敗すれば、例外は自動的にキャッチされ、非同期関数の実行が中断され、暗黙的に返される Promise を経由してエラーが呼び出し元へ伝えられます。</li>
+ <li>同じことが Promise の場合にも起こり、関数は、関数の完了をとらえて戻ってくる <code>Promise</code> の面倒を見なければなりません。これは <code>concurrentPromise</code> では <code>Promise.all([]).then()</code> が返す Promise を <code>return</code> することを意味します。実は、この例の前のバージョンはこれをやり忘れていました！</li>
+</ul>
+
+<p>しかしながら非同期関数も誤ってエラーを飲み込んでしまうことがあります。</p>
+
+<p>上記の <code>parallel</code> という非同期関数を例にしてみましょう。もしこれが <code>Promise.all([])</code> 呼び出しの結果を <code>await</code> (もしくは <code>return</code>) しなければ、任意のエラーは伝わりません。</p>
+
+<p><code>parallelPromise</code> の例は簡潔に見えるものの、エラーをまったくハンドルしていません！同じことをするには、やはり <code>return Promise.all[()]</code> が必要になります。</p>
+</div>
+
+<h3 id="Rewriting_a_promise_chain_with_an_async_function" name="Rewriting_a_promise_chain_with_an_async_function">promise チェーンをasync function で 書き換える</h3>
+
+<p>Promise を返す API は Promise チェーンで解決され、関数を複数の部品に分割できます。次のコードを想定してください。</p>
+
+<pre class="brush: js notranslate">function getProcessedData(url) {
+  return downloadData(url) // returns a promise
+    .catch(e =&gt; {
+      return downloadFallbackData(url)  // returns a promise
+    })
+    .then(v =&gt; {
+      return processDataInWorker(v)  // returns a promise
+    })
+}
+</pre>
+
+<p>次のように 1 つの <code>async</code> 関数に書き直すことができます。</p>
+
+<pre class="brush: js notranslate">async function getProcessedData(url) {
+  let v
+  try {
+    v = await downloadData(url)
+  } catch(e) {
+    v = await downloadFallbackData(url)
+  }
+  return processDataInWorker(v)
+}
+</pre>
+
+<p>上記の例では、 <code>return</code> ステートメント上に <code>await</code> ステートメントがないことに注目してください。なぜなら、<code>async function</code> の返値は暗黙的に {{jsxref("Promise.resolve")}} でラップされているからです。</p>
+
+<div class="blockIndicator note">
+<h4 id="return_await_promiseValue_vs._return_promiseValue" name="return_await_promiseValue_vs._return_promiseValue">return await promiseValue と return promiseValue</h4>
+
+<p>返値が {{jsxref("Promise.resolve")}} で暗黙にラッピングされるとはいえ、 <code>return await promiseValue</code> が <code>return promiseValue</code> と機能的に等価である訳ではありません。</p>
+
+<p>上記のコードを以下のように書き直したと想像してください。これは <code>processDataInWorker</code> がエラーで拒否した場合に <code>null</code> を返します。</p>
+
+<pre class="brush: js notranslate">async function getProcessedData(url) {
+  let v
+  try {
+    v = await downloadData(url)
+  } catch(e) {
+    v = await downloadFallbackData(url)
+  }
+  try {
+    return await processDataInWorker(v)  // Note the `return await` vs. just `return`
+  } catch (e) {
+    return null
+  }
+}
+</pre>
+
+<p><code>return processDataInWorker(v)</code> と記述すると、 <code>processDataInWorker(v)</code> が拒否した場合に <code>null</code> に解決されるのではなく、関数が返した {{jsxref("Promise")}} が拒否されてしまいます。</p>
+
+<p>これは、 <code>return foo;</code> と <code>return await foo;</code> の微妙な違いを強調しています。 - <code>return foo</code> はすぐに <code>foo</code> を返し、 <code>foo</code> が拒否する Promise であっても例外を発生させません。 <code>return await foo</code> は、それが Promise であれば <code>foo</code> が解決するか拒否するかを待ち、拒否した場合は<strong>返す前</strong>に例外を発生させます。</p>
+</div>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div>
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.async_function")}}</p>
+</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
+ <li>{{jsxref("AsyncFunction")}} オブジェクト</li>
+ <li>{{jsxref("Operators/await", "await")}}</li>
+ <li><a href="http://innolitics.com/10x/javascript-decorators-for-promise-returning-functions/">"innolitics.com" の "Decorating Async Javascript Functions"</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/block/index.html b/files/ja/web/javascript/reference/statements/block/index.html
new file mode 100644
index 0000000000..ea2b87acb2
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/block/index.html
@@ -0,0 +1,118 @@
+---
+title: ブロック
+slug: Web/JavaScript/Reference/Statements/block
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/block
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>ブロック文</strong> (他の言語では <strong>複合文</strong> とも呼ばれる) は 0 個以上の文をグループ化するのに使われます。ブロックは中括弧 (「波括弧」) の組で区切られ、場合によっては{{jsxref("Statements/label", "ラベル", "", 1)}}が付くことがあります。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-block.html", "taller")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<h3 id="Block_Statement" name="Block_Statement">ブロック文</h3>
+
+<pre class="syntaxbox notranslate">{
+  <em>StatementList</em>
+}
+</pre>
+
+<h3 id="Labelled_Block_Statement" name="Labelled_Block_Statement">ラベル付きブロック文</h3>
+
+<pre class="syntaxbox notranslate"><em>LabelIdentifier</em>: {
+  <em>StatementList</em>
+}
+</pre>
+
+<dl>
+ <dt><code>StatementList</code></dt>
+ <dd>ブロック文の中でグループ化される文。</dd>
+ <dt><code>LabelIdentifier</code></dt>
+ <dd>省略可能な{{jsxref("Statements/label", "ラベル", "", 1)}}で、視覚的な識別のため、または {{jsxref("Statements/break", "break")}} のターゲットとして使われます。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>ブロック文は、他の言語ではよく<strong>複合文</strong>と呼ばれます。これは複数の文を JavaScript からみて1つの文にまとめるために使用します。ブロック内に複数の文をまとめることは、JavaScript ではよく行われることです。反対の動作は<a href="/en-US/docs/Web/JavaScript/Reference/Statements/Empty">空文</a>を使用することで実現でき、これは1つの文が必要な場所に文を置かずにおくことができます。</p>
+
+<p>ブロックは、{{jsxref("Statements/if...else", "if...else")}} や {{jsxref("Statements/for", "for")}} 文との組み合わせでよく使用されます。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Block_scoping_rules_with_var_or_function_declaration_in_non-strict_mode" name="Block_scoping_rules_with_var_or_function_declaration_in_non-strict_mode">非厳格モード時の var または関数定義のブロックスコープの規則</h3>
+
+<p>非厳格モードでは、<code>var</code> の宣言や、<a href="/ja/docs/Web/JavaScript/Reference/Statements/function">関数宣言</a>で作成された変数は、ブロックスコープを<strong>持ちません</strong>。ブロック内で導入された変数は、それを含んでいる関数またはスクリプトがスコープとなり、変数を設定した効果は、そのブロック自体を超えて持続します。言い換えれば、ブロック文はスコープをもたらしません。例えば、</p>
+
+<pre class="brush: js example-bad notranslate">var x = 1;
+{
+  var x = 2;
+}
+console.log(x); // 2 が出力されます
+</pre>
+
+<p>これが 2 を出力するのは、ブロックの中の <code>var x</code> 文がブロックより前と同じスコープを持つからです。</p>
+
+<p>非厳格モードでは、ブロック内の関数定義は奇妙な動きをします。使用しないでください。</p>
+
+<h3 id="Block_scoping_rules_with_let_const_or_function_declaration_in_strict_mode" name="Block_scoping_rules_with_let_const_or_function_declaration_in_strict_mode">厳格モード時の let、const、関数宣言のブロックスコープの規則</h3>
+
+<p>対照的に、{{jsxref("Statements/let", "let")}} と {{jsxref("Statements/const", "const")}} で宣言された識別子は、ブロックスコープを<strong>持ち</strong>ます。</p>
+
+<pre class="brush: js notranslate">let x = 1;
+{
+  let x = 2;
+}
+console.log(x); // 1 が出力されます</pre>
+
+<p>この <code>x = 2</code> は、それが定義されたブロックのスコープに制限されています。</p>
+
+<p>同じことが <code>const</code> にも言えます。</p>
+
+<pre class="brush: js notranslate">const c = 1;
+{
+  const c = 2;
+}
+console.log(c); // 1 が出力され、SyntaxError は発生しない...</pre>
+
+<p>ブロックスコープを持つ <code>const c = 2</code> は、ブロック内で固有に宣言することができるため、<code>SyntaxError: Identifier 'c' has already been declared</code> を発生させ<em>ない</em>ことに注意してください。</p>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a>は ES2015 に導入され、ブロック内の関数がそのブロックのスコープを持ちます。ES2015 より前では、ブロックレベルの関数は厳格モードで禁止されていました。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-block', 'Block statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.block")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/while", "while")}}</li>
+ <li>{{jsxref("Statements/if...else", "if...else")}}</li>
+ <li>{{jsxref("Statements/let", "let")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/break/index.html b/files/ja/web/javascript/reference/statements/break/index.html
new file mode 100644
index 0000000000..4ee541b435
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/break/index.html
@@ -0,0 +1,157 @@
+---
+title: break
+slug: Web/JavaScript/Reference/Statements/break
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/break
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>break</code> 文</strong>は現在のループや {{jsxref("Statements/switch", "switch")}} 文や{{jsxref("Statements/label", "ラベル", "", 1)}}文を中断し、中断した文の次の文にプログラムの制御を移します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-break.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">break [<var>label</var>];</pre>
+
+<dl>
+ <dt><code><var>label</var></code> {{optional_inline}}</dt>
+ <dd>中断する文のラベルに関連付けられた識別子。中断する文がループでも {{jsxref("Statements/switch", "switch")}} でもない場合、ラベルは必須です。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>break</code> 文は、オプションでラベルを指定して、ラベル付き文の外にプログラムを脱出させることができます。 <code>break</code> 文は参照されるラベルの内側にある必要があります。ラベルはあらゆる{{jsxref("Statements/block", "ブロック", "", 1)}}文に付けることができます。ループ文の前である必要はありません。</p>
+
+<p><code>break</code> 文は、その後にラベルがあるかどうかに関わらず、 <code>break</code> 文で脱出しようとする現在のループや switch やラベル付き文の中に含まれる関数の本体の中で使用することはできません。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="break_in_while_loop" name="break_in_while_loop">while ループにおける break</h3>
+
+<p>次の関数には <code>i</code> が <code>3</code> の時に {{jsxref("Statements/while", "while")}} 文を中断する <code>break</code> 文があるので、<code>3 * x</code> の値を返します。</p>
+
+<pre class="brush:js;highlight:[6]; notranslate">function testBreak(x) {
+  var i = 0;
+
+  while (i &lt; 6) {
+    if (i == 3) {
+      break;
+    }
+    i += 1;
+  }
+
+  return i * x;
+}</pre>
+
+<h3 id="break_in_switch_statements" name="break_in_switch_statements">switch 文における break</h3>
+
+<p>次のコードには、一致する case と対応するコードが実行された後で {{jsxref("Statements/switch", "switch")}} 文を終了するための <code>break</code> があります。</p>
+
+<pre class="brush:js;highlight:[6]; notranslate">const food = "sushi";
+
+switch (food) {
+  case "sushi":
+    console.log("Sushi is originally from Japan.");
+    break;
+  case "pizza":
+    console.log("Pizza is originally from Italy.");
+    break;
+  default:
+    console.log("I have never heard of that dish.");
+    break;
+}
+</pre>
+
+<h3 id="break_in_labeled_blocks" name="break_in_labeled_blocks">ラベル付きブロックにおける break</h3>
+
+<p>次のコードは、ラベル付きブロックで <code>break</code> 文を使っています。 <code>break</code> 文は、それを参照するラベル付き文の内側になければなりません。 <code>inner_block</code> が <code>outer_block</code> の中にあることに注意してください。</p>
+
+<pre class="brush:js;highlight:[1,2,4]; notranslate">outer_block: {
+  inner_block: {
+    console.log('1');
+    break outer_block; // inner_block および outer_block の両方から抜けます
+    console.log(':-('); // スキップされる
+  }
+  console.log('2'); // スキップされる
+}
+</pre>
+
+<h3 id="break_in_labeled_blocks_that_throw" name="break_in_labeled_blocks_that_throw">ラベル付きブロックにおける break でエラーが発生するもの</h3>
+
+<p>次のコードもラベル付きブロックで <code>break</code> 文を使っていますが、 <code>break</code> 文が <code>block_1</code> の内側にあるにもかかわらず <code>block_2</code> を参照しているので、 <code>SyntaxError</code> が発生します。 <code>break</code> は、参照先ラベルの内側になければなりません。</p>
+
+<pre class="brush:js;highlight:[1,3,6]; notranslate">block_1: {
+  console.log('1');
+  break block_2; // SyntaxError: label not found
+}
+
+block_2: {
+  console.log('2');
+}
+</pre>
+
+<h3 id="break_within_functions" name="break_within_functions">関数における break</h3>
+
+<p>以下のコード例でも <code>SyntaxError</code> が発生します。これは <code>break</code> をループの中にある関数や、 <code>break</code> 文で脱出しようとしているラベル付きブロックの中にある関数の中で使用しているためです。</p>
+
+<pre class="brush:js;highlight:[1,3,6]; notranslate">function testBreak(x) {
+  var i = 0;
+
+  while (i &lt; 6) {
+    if (i == 3) {
+      (function() {
+        break;
+      })();
+    }
+    i += 1;
+  }
+
+return i * x;
+}
+
+testBreak(1); // SyntaxError: Illegal break statement
+</pre>
+
+<pre class="brush:js;highlight:[1,3,6]; notranslate">block_1: {
+  console.log('1');
+  ( function() {
+    break block_1; // SyntaxError: Undefined label 'block_1'
+  })();
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-break-statement', 'Break statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.break")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/continue", "continue")}}</li>
+ <li>{{jsxref("Statements/label", "ラベル", "", 1)}}</li>
+ <li>{{jsxref("Statements/switch", "switch")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/class/index.html b/files/ja/web/javascript/reference/statements/class/index.html
new file mode 100644
index 0000000000..fb92abda81
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/class/index.html
@@ -0,0 +1,102 @@
+---
+title: class
+slug: Web/JavaScript/Reference/Statements/class
+tags:
+  - Classes
+  - Declaration
+  - ECMAScript6
+  - JavaScript
+  - Reference
+  - クラス
+  - 宣言
+translation_of: Web/JavaScript/Reference/Statements/class
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>クラス宣言</strong>は、プロトタイプベースの継承を使って、指定された名前の新しいクラスを作成します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-class.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<div class="noinclude">
+<p>{{jsxref("Operators/class", "クラス式", "", 1)}}を使ってクラスを定義することもできます。しかし、クラス式と異なり、クラス宣言は既存のクラスを再宣言することができず、再宣言しようとすると {{jsxref("SyntaxError")}} が発生します。</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox">class <var>name</var> [extends <var>otherName</var>] {
+  // クラス本体
+}</pre>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>クラス式と同様、クラス宣言の内部は<a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a>で実行されます。 <code>constructor</code> メソッドは省略可能です。</p>
+
+<p>クラス宣言は{{Glossary("Hoisting", "巻き上げ")}}が行われません (<a href="/ja/docs/Web/JavaScript/Reference/Statements/function">関数宣言</a>とは異なります)。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="A_simple_class_declaration" name="A_simple_class_declaration">単純なクラス宣言</h3>
+
+<p>次の例では、はじめに <code>Polygon</code> という名前のクラスを定義し、次にそれを拡張して <code>Square</code> という名前のクラスを作成します。</p>
+
+<p>なお、コンストラクターで使われている <code>super()</code> は、コンストラクター内でのみ使えること、 <code>this</code> キーワードの使用<em>前</em>に呼び出さなくてはならないことに注意してください。</p>
+
+<pre class="brush: js">class Polygon {
+  constructor(height, width) {
+    this.name = 'Polygon';
+    this.height = height;
+    this.width = width;
+  }
+}
+
+class Square extends Polygon {
+  constructor(length) {
+    super(length, length);
+    this.name = 'Square';
+  }
+}</pre>
+
+<h3 id="Attempting_to_declare_a_class_twice" name="Attempting_to_declare_a_class_twice">クラスを二度宣言する</h3>
+
+<p>クラス宣言を使って再度クラスを宣言すると、 {{jsxref("SyntaxError")}} が発生します。</p>
+
+<pre class="brush: js example-bad">class Foo {};
+class Foo {}; // Uncaught SyntaxError: Identifier 'Foo' has already been declared
+</pre>
+
+<p>クラス式を使って事前にクラスを定義していたときも、同じエラーが発生します。</p>
+
+<pre class="brush: js example-bad">let Foo = class {};
+class Foo {}; // Uncaught SyntaxError: Identifier 'Foo' has already been declared
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.class")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Statements/function"><code>function</code> 宣言</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> 式</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Classes">クラス</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/const/index.html b/files/ja/web/javascript/reference/statements/const/index.html
new file mode 100644
index 0000000000..43adf695ee
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/const/index.html
@@ -0,0 +1,157 @@
+---
+title: const
+slug: Web/JavaScript/Reference/Statements/const
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - constants
+translation_of: Web/JavaScript/Reference/Statements/const
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>定数 (const) は、<code><a href="/ja/docs/Web/JavaScript/Reference/Statements/let">let</a></code> キーワードを使って定義する変数と同じ、ブロックスコープを持ちます。定数の値は、再代入による変更はできず、再宣言もできません。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-const.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">const <var>name1</var> = <var>value1</var> [, <var>name2</var> = <var>value2</var> [, ... [, <var>nameN</var> = <var>valueN</var>]]];</pre>
+
+<dl>
+ <dt><code><var>nameN</var></code></dt>
+ <dd>定数名。正当な{{Glossary("identifier", "識別子")}}ならは、どんなものでもかまいません。</dd>
+ <dt><code><var>valueN</var></code></dt>
+ <dd>定数の値。正当な<a href="/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions">式</a>ならば、どんなものでもかまいません。</dd>
+</dl>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">分割代入</a>構文は、変数の宣言にも使用できます。</p>
+
+<pre class="syntaxbox notranslate">const <var>{ bar }</var> = <em>foo</em>; // where foo = { bar:10, baz:12 };
+/* これは、値が 10 の 'bar' という名前の変数を作成します。*/</pre>
+
+<dl>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>この宣言は、宣言された場所に応じて、グローバルまたはブロック内にローカルなスコープを持った定数を作成します。グローバルな定数は {{jsxref("Statements/var", "var")}} 変数とは異なり、{{domxref("window")}} オブジェクトのプロパティには<strong>なりません</strong>。</p>
+
+<p>定数には初期化子が必要です。その値は、宣言されたのと同じ文の中で指定しなければなりません。(後から変更できないことを考えると、これは理にかなっています)</p>
+
+<p><strong><code>const</code> 宣言</strong>は、値への読み取り専用の参照を作ります。これは、定数に保持されている値は<strong>不変ではなく</strong>、その変数の識別子が再代入できないということです。たとえば、定数の中身がオブジェクトの場合、オブジェクトの内容（プロパティなど）は変更可能です。</p>
+
+<p>「<a href="/ja/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone">一時的なデッドゾーン</a>」に関する考慮事項はすべて、{{jsxref("Statements/let", "let")}} と <code>const</code> の両方に適用されます。</p>
+
+<p>定数は、同じスコープ内の関数や変数と同じ名前にすることはできません。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Basic_const_usage" name="Basic_const_usage">基本的な定数の使い方</h3>
+
+<p>定数は大文字または小文字で宣言することができますが、すべて大文字で宣言するのが慣例です。</p>
+
+<pre class="brush: js; notranslate">// MY_FAV を定数として定義して、その値を 7 にします。
+const MY_FAV = 7;
+
+// これはエラーを投げます。
+// Uncaught TypeError: Assignment to constant variable.
+MY_FAV = 20;
+
+// MY_FAV は 7 です。
+console.log('my favorite number is: ' + MY_FAV);
+
+// 定数を再宣言しようとするとエラーを投げます。
+// Uncaught SyntaxError: Identifier 'MY_FAV' has already been declared
+const MY_FAV = 20;
+
+// MY_FAV という名前は上記の定数のために予約されているので、これも失敗します。
+var MY_FAV = 20;
+
+// これもエラーを投げます。
+let MY_FAV = 20;
+
+</pre>
+
+<h3 id="Block_scoping" name="Block_scoping">ブロックスコープ</h3>
+
+<p>ブロックスコープの性質に注意することが重要です。</p>
+
+<pre class="brush: js notranslate">if (MY_FAV === 7) {
+  // これは問題なく、ブロックスコープの MY_FAV 変数を作成します。
+  // （ブロックスコープの変数を宣言する let も問題なく機能します）
+  let MY_FAV = 20;
+
+  // MY_FAV は現在 20 です。
+  console.log('my favorite number is ' + MY_FAV);
+
+  // これはグローバルコンテキストに巻き上げられ、エラーを投げます。
+  var MY_FAV = 20;
+}
+
+// MY_FAV は 7 のままです。
+console.log('my favorite number is ' + MY_FAV);
+</pre>
+
+<h3 id="const_needs_to_be_initialized" name="const_needs_to_be_initialized">定数は初期化が必要です。</h3>
+
+<pre class="brush: js notranslate">// エラーが投げられます。
+// Uncaught SyntaxError: Missing initializer in const declaration
+
+const FOO;
+</pre>
+
+<h3 id="const_in_objects_and_arrays" name="const_in_objects_and_arrays">オブジェクトと配列の定数</h3>
+
+<p>定数はオブジェクトや配列に対しても動作します。</p>
+
+<pre class="brush: js notranslate">const MY_OBJECT = {'key': 'value'};
+
+// オブジェクトの上書きはエラーを投げます。
+// Uncaught TypeError: Assignment to constant variable.
+MY_OBJECT = {'OTHER_KEY': 'value'};
+
+// しかしながら、オブジェクトのキーは保護されていないので、
+// 次の文は問題なく実行されます。
+MY_OBJECT.key = 'otherValue'; // Object.freeze() を使用すればオブジェクトを不変にできます。
+
+// 配列も同じです。
+const MY_ARRAY = [];
+// 配列にアイテムをプッシュすることができます。
+MY_ARRAY.push('A'); // ["A"]
+// しかしながら、新しい配列を変数に代入するとエラーを投げます。
+// Uncaught TypeError: Assignment to constant variable.
+MY_ARRAY = ['B'];</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.const")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/var", "var")}}</li>
+ <li>{{jsxref("Statements/let", "let")}}</li>
+ <li><a href="/ja/docs/Web/JavaScript/Guide/Grammar_and_types#Constants">JavaScript ガイド - 『値、変数、リテラル』 - 定数</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/continue/index.html b/files/ja/web/javascript/reference/statements/continue/index.html
new file mode 100644
index 0000000000..76bcc65b8b
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/continue/index.html
@@ -0,0 +1,144 @@
+---
+title: continue
+slug: Web/JavaScript/Reference/Statements/continue
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/continue
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>continue</code> 文</strong>は、現在のループまたはラベル付きループの現在反復処理中の文の実行を終了して、次の反復処理でループの実行を続けます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-continue.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">continue [<var>label</var>];</pre>
+
+<dl>
+ <dt><code><var>label</var></code></dt>
+ <dd>その文のラベルに関連付けられた識別子。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>{{jsxref("Statements/break", "break")}} 文と対照的に、 <code>continue</code> はループの実行を完全には終了しません。代わりに、</p>
+
+<ul>
+ <li>{{jsxref("Statements/while", "while")}} ループでは、条件式にジャンプします。</li>
+</ul>
+
+<ul>
+ <li>{{jsxref("Statements/for", "for")}} ループでは、更新式までジャンプします。</li>
+</ul>
+
+<p><code>continue</code> 文には任意でラベルを含めることができ、現在のループの代わりにラベル付きループ文の次の反復処理へジャンプすることができます。この場合、<code>continue</code> 文は、ラベル付き文の中にある必要があります。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_continue_with_while" name="Using_continue_with_while">while における continue の使用</h3>
+
+<p>次の例では、 {{jsxref("Statements/while", "while")}} ループで <code>i</code> の値が 3 であるときに実行される <code>continue</code> 文を持つものを示しています。よって、 <code>n</code> は 1、3、7、12 の値をとります。</p>
+
+<pre class="brush: js notranslate">var i = 0;
+var n = 0;
+
+while (i &lt; 5) {
+  i++;
+
+  if (i === 3) {
+    continue;
+  }
+
+  n += i;
+}
+</pre>
+
+<h3 id="Using_continue_with_a_label" name="Using_continue_with_a_label">ラベル付き continue の使用</h3>
+
+<p>次の例では、<code>checkiandj</code> とラベル付けされた文が、<code>checkj</code> とラベル付けされた文を含んでいます。もし <code>continue</code> と遭遇したなら、プログラムは <code>checkj</code> 文の先頭から継続します。<code>continue</code> と遭遇するたびに、<code>checkj</code> の条件が false を返すまで、<code>checkj</code> は再度反復します。false が返されたら、<code>checkiandj</code> 文の残りが完遂されます。</p>
+
+<p>もし <code>continue</code> がラベル <code>checkiandj</code> を持っていたなら、プログラムは <code>checkiandj</code> 文の先頭から継続します。</p>
+
+<p>{{jsxref("Statements/label", "ラベル", "", 1)}}もご覧ください。</p>
+
+<pre class="brush: js notranslate">var i = 0;
+var j = 8;
+
+checkiandj: while (i &lt; 4) {
+  console.log('i: ' + i);
+  i += 1;
+
+  checkj: while (j &gt; 4) {
+    console.log('j: ' + j);
+    j -= 1;
+
+    if ((j % 2) == 0)
+      continue checkj;
+    console.log(j + ' is odd.');
+  }
+  console.log('i = ' + i);
+  console.log('j = ' + j);
+}
+</pre>
+
+<p>結果:</p>
+
+<pre class="brush: js notranslate">i: 0
+
+// start checkj
+j: 8
+7 is odd.
+j: 7
+j: 6
+5 is odd.
+j: 5
+// end checkj
+
+i = 1
+j = 4
+
+i: 1
+i = 2
+j = 4
+
+i: 2
+i = 3
+j = 4
+
+i: 3
+i = 4
+j = 4
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-continue-statement', 'Continue statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.continue")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/break", "break")}}</li>
+ <li>{{jsxref("Statements/label", "ラベル", "", 1)}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/debugger/index.html b/files/ja/web/javascript/reference/statements/debugger/index.html
new file mode 100644
index 0000000000..c4add1052b
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/debugger/index.html
@@ -0,0 +1,59 @@
+---
+title: debugger
+slug: Web/JavaScript/Reference/Statements/debugger
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/debugger
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>debugger</code> 文</strong>は、ブレークポイントの設定のような任意の利用可能なデバッグ機能を呼び出します。デバッグ機能が利用可能ではない場合、この文は効果がありません。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">debugger;</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_the_debugger_statement" name="Using_the_debugger_statement">debugger 文の使用</h3>
+
+<p>次の例は、関数が呼び出されたときに、デバッガーを (存在すれば) 呼び出すように、 <code>debugger</code> 文が挿入されているコードを示します。</p>
+
+<pre class="brush:js notranslate">function potentiallyBuggyCode() {
+    debugger;
+    // do potentially buggy stuff to examine, step through, etc.
+}</pre>
+
+<p>デバッガーが起動していると、実行は <code>debugger</code> 文で停止します。スクリプトのソース内でのブレークポイントと似ています。</p>
+
+<p><a href="https://mdn.mozillademos.org/files/6963/Screen Shot 2014-02-07 at 9.14.35 AM.png"><img alt="Paused at a debugger statement." src="https://mdn.mozillademos.org/files/6963/Screen%20Shot%202014-02-07%20at%209.14.35%20AM.png" style="height: 371px; width: 700px;"></a></p>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-debugger-statement', 'Debugger statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.debugger")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Mozilla/Debugging/Debugging_JavaScript">JavaScript のデバッグ</a></li>
+ <li><a href="/ja/docs/Tools/Debugger">Firefox 開発者ツール内のデバッガー</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/do...while/index.html b/files/ja/web/javascript/reference/statements/do...while/index.html
new file mode 100644
index 0000000000..b38381139a
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/do...while/index.html
@@ -0,0 +1,79 @@
+---
+title: do...while
+slug: Web/JavaScript/Reference/Statements/do...while
+tags:
+  - JavaScript
+  - Statement
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/do...while
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>do...while</code> 文</strong>は指定された文を、テスト条件が false に評価されるまで実行するループを作成します。条件は文を実行した後に評価されます。結果として、指定された文は少なくとも 1 回は実行されます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-dowhile.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox">do
+   <em>statement</em>
+while (<em>condition</em>);
+</pre>
+
+<dl>
+ <dt><code><em>statement</em></code></dt>
+ <dd>少なくとも 1 回は実行され、条件が真に評価されるたびに再度実行される文。ループ内で複数の文を実行するには、それらの文をグループ化するために{{jsxref("Statements/block", "ブロック", "", 1)}}文 (<code>{ ... }</code>) を使ってください。</dd>
+</dl>
+
+<dl>
+ <dt><code><em>condition</em></code></dt>
+ <dd>ループを通過した後ごとに評価される式。もし <code>condition</code> が true に評価されるなら、<code>statement</code> は再度実行されます。<code>condition</code> が false に評価されるときは、制御が <code>do...while</code> に続く文へ渡ります。</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_do...while" name="Using_do...while"><code>do...while</code> の使用</h3>
+
+<p>次の例では、 <code>do...while</code> ループを少なくとも1回は実行し、 <code>i</code> が 5 より小さいという条件を満たさなくなるまで反復します。</p>
+
+<pre class="brush: js">var result = '';
+var i = 0;
+do {
+   i += 1;
+   result += i + ' ';
+}
+while (i &gt; 0 &amp;&amp; i &lt; 5);
+// Despite i == 0 this will still loop as it starts off without the test
+
+console.log(result);</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-do-while-statement', 'do-while statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.do_while")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/while", "while")}}</li>
+ <li>{{jsxref("Statements/for", "for")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/empty/index.html b/files/ja/web/javascript/reference/statements/empty/index.html
new file mode 100644
index 0000000000..022e12076b
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/empty/index.html
@@ -0,0 +1,94 @@
+---
+title: 空文
+slug: Web/JavaScript/Reference/Statements/Empty
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/Empty
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>空文</strong> は、JavaScript 構文で文が想定されているときに、文を用意しないために使います。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-empty.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">;
+</pre>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>空文はセミコロン (<code>;</code>) で、JavaScript 構文が文を必要とするときでも文を実行しないことを示します。</p>
+
+<p>逆のふるまいとして、 JavaScript が単一文のみ許可しているのに複数の文にしたい場合には、<a href="/ja/docs/Web/JavaScript/Reference/Statements/block">ブロック文</a>を使ってください。ブロック文は、いくつかの文を単一文に結合します。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Empty_loop_body" name="Empty_loop_body">空のループ本体</h3>
+
+<p>空文は、ループ文で使われることがあります。ループ本体が空である以下の例をご覧ください。</p>
+
+<pre class="brush: js notranslate">let arr = [1, 2, 3];
+
+// 配列の値をすべて 0 にする
+for (let i = 0; i &lt; arr.length; arr[i++] = 0) /* 空文 */ ;
+
+console.log(arr);
+// [0, 0, 0]
+</pre>
+
+<h3 id="Unintentional_usage" name="Unintentional_usage">意図的でない使用</h3>
+
+<p>空文を<em>意図的</em>に使っていることをコメントするとよいでしょう。通常のセミコロンと区別するのが難しいからです。</p>
+
+<p>次の例は、おそらく意図的でない使用例です。</p>
+
+<pre class="brush: js example-bad notranslate">if (condition);       // 注意: この "if" は何の意味もない!
+   killTheUniverse()  // この関数が常に実行される!!!
+</pre>
+
+<p>次の例では、 {{jsxref("Statements/if...else", "if...else")}} 文が中括弧 (<code>{}</code>) なしで使われています。</p>
+
+<p><code>three</code> が <code>true</code> である場合、何も起こらず、 <code>four</code> の値にも関係なく、 <code>else</code> 内の <code>launchRocket()</code> 関数も実行されません。</p>
+
+<pre class="brush: js example-bad notranslate">if (one)
+  doOne();
+else if (two)
+  doTwo();
+else if (three)
+  ; // 何もしない
+else if (four)
+  doFour();
+else
+  launchRocket();</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-empty-statement', 'Empty statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.empty")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/block", "Block statement")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/export/index.html b/files/ja/web/javascript/reference/statements/export/index.html
new file mode 100644
index 0000000000..0f8478f74c
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/export/index.html
@@ -0,0 +1,268 @@
+---
+title: export
+slug: Web/JavaScript/Reference/Statements/export
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Language feature
+  - Modules
+  - Reference
+  - Statement
+  - export
+translation_of: Web/JavaScript/Reference/Statements/export
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>export</code></strong> 文は JavaScript モジュールを作成するときに使用され、モジュールから関数、オブジェクト、またはプリミティブ値へのライブバインディングのエクスポートを行い、{{jsxref("Statements/import", "import")}} 文を使用した他のプログラムが使用できるようにします。インポートされたモジュールは読み取り専用で、エクスポートされたモジュールが変更されるたびに値が更新されます。</p>
+
+<p>エクスポートされたモジュールは、宣言のあるなしにかかわらず {{jsxref("Strict_mode","Strict モード", "", 1)}}で動作します。export 文は、埋め込みスクリプトでは使えません。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<p>2種類のエクスポート方法があります。</p>
+
+<ol>
+ <li>名前付きエクスポート (モジュールごとに 0 以上のエクスポート)</li>
+ <li>デフォルトエクスポート (モジュールごとに 1 つのエクスポート)</li>
+</ol>
+
+<pre class="syntaxbox notranslate">// 個々の機能をエクスポート
+export let <var>name1</var>, <var>name2</var>, …, <var>nameN</var>; // var, const も
+export let <var>name1</var> = …, <var>name2</var> = …, …, <var>nameN</var>; // var, const も
+export function functionName(){...}
+export class ClassName {...}
+
+// リストでエクスポート
+export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> };
+
+// 名前を変更してエクスポート
+export { <var>variable1</var> as <var>name1</var>, <var>variable2</var> as <var>name2</var>, …, <var>nameN</var> };
+
+// 分割代入してエクスポート
+export const { <var>name1</var>, <var>name2: bar</var> } = o;
+
+// デフォルトエクスポート
+export default <em>expression</em>;
+export default function (…) { … } // class, function* も使用可
+export default function name1(…) { … } // class, function* も使用可
+export { <var>name1</var> as default, … };
+
+// モジュールの集約
+export * from …; // デフォルトエクスポートを設定しません
+export * as name1 from …; // ECMAScript® 2O21 の草案
+export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> } from …;
+export { <var>import1</var> as <var>name1</var>, <var>import2</var> as <var>name2</var>, …, <var>nameN</var> } from …;
+export { default } from …;</pre>
+
+<dl>
+ <dt><code><var>nameN</var></code></dt>
+ <dd>エクスポートする識別子です。(別のスクリプトが {{jsxref("Statements/import", "import")}} を使用してインポート可能になります。) </dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>エクスポート方法は、<strong>名前付き</strong>と<strong>デフォルト</strong>の 2 種類あります。名前付きエクスポートはモジュールごとに複数持てますが、デフォルトエクスポートは 1 つに限ります。それぞれのエクスポート方法は、上記の構文のひとつに対応します。</p>
+
+<p>名前付きエクスポート:</p>
+
+<pre class="brush: js notranslate">// 事前に宣言された機能のエクスポート
+export { myFunction, myVariable };
+
+// 個別の機能のエクスポート
+// (var, let, const, function, class がエクスポート可能)
+export let myVariable = Math.sqrt(2);
+export function myFunction() { ... };
+</pre>
+
+<p>デフォルトエクスポート:</p>
+
+<pre class="brush: js notranslate">// デフォルトとして事前に定義された機能のエクスポート
+export { myFunction as default };
+
+// 個別の機能をデフォルトとしてエクスポート
+export default function () { ... }
+export default class { .. }
+
+// 各エクスポートは前のエクスポートを上書きします
+</pre>
+
+<p>名前付きエクスポートは、さまざまな値をエクスポートするのに役立ちます。インポートするときは、対応するオブジェクトと同じ名前を使用しなければなりません。</p>
+
+<p>一方、デフォルトエクスポートは以下のように任意の名前を使用できます。</p>
+
+<pre class="brush: js notranslate">// ファイル test.js
+let k; export default k = 12;
+</pre>
+
+<pre class="brush: js notranslate">// 他のファイル
+import m from './test'; // k がデフォルトエクスポートなので、インポートする k の代わりに m を使用することができる点に注意してください
+console.log(m);        // log 12 になる
+</pre>
+
+<p>名前の競合を防ぐために、名前付きエクスポートの名前を変更することもできます。</p>
+
+<pre class="brush: js notranslate">export { <var>myFunction</var> as <var>function1</var>,<var>
+         myVariable</var> as variable };</pre>
+
+<h3 id="Re-exporting_Aggregating" name="Re-exporting_Aggregating">再エクスポート / 集約</h3>
+
+<p>また、親モジュール内の異なるモジュールから「インポート/エクスポート」して、そのモジュールからインポートできるようにすることも可能です。言い換えれば、様々なモジュールからの様々なエクスポートを集約した 1 つのモジュールを作成することができます。</p>
+
+<p>これは "export from" 構文で実現できます。</p>
+
+<pre class="brush: js notranslate">export { default as function1,
+         function2 } from 'bar.js';
+</pre>
+
+<p>これは、インポートとエクスポートの組み合わせに相当します。</p>
+
+<pre class="brush: js notranslate">import { default as function1,
+         function2 } from 'bar.js';
+export { function1, function2 };
+</pre>
+
+<p>現在のモジュール内で <code>function1</code> と <code>function2</code> が利用できない場合。</p>
+
+<div class="blockIndicator note">
+<p><strong>メモ:</strong> 以下は、インポートに相当するにもかかわらず、構文的に無効です。</p>
+</div>
+
+<pre class="brush: js notranslate">import DefaultExport from 'bar.js'; // 有効
+</pre>
+
+<pre class="brush: js notranslate">export DefaultExport from 'bar.js'; // 無効</pre>
+
+<p>これを行う正しい方法は、エクスポートの名前を変更することです。</p>
+
+<pre class="brush: js notranslate">export { default as DefaultExport } from 'bar.js';
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_named_exports" name="Using_named_exports">名前付きエクスポートの使用</h3>
+
+<p><code>my-module.js</code> モジュールの中で、以下のコードを含めることができます。</p>
+
+<pre class="brush: js notranslate">// "my-module.js" モジュール
+function cube(x) {
+  return x * x * x;
+}
+
+const foo = Math.PI + Math.SQRT2;
+
+var graph = {
+  options: {
+      color:'white',
+      thickness:'2px'
+  },
+  draw: function() {
+      console.log('From graph draw function');
+  }
+}
+
+export { cube, foo, graph };
+</pre>
+
+<p>HTML ページの中に含まれる最上位モジュールの中では、次のようにすることができます。</p>
+
+<pre class="brush: js notranslate">import { cube, foo, graph } from './my-module.js';
+
+graph.options = {
+    color:'blue',
+    thickness:'3px'
+};
+
+graph.draw();
+console.log(cube(3)); // 27
+console.log(foo);    // 4.555806215962888</pre>
+
+<p>以下の点に注意することが重要です。</p>
+
+<ul>
+ <li>このスクリプトを HTML の {{htmlelement("script")}} 要素で type="module" を指定したものに入れる必要があり、そうすれば適切にモジュールとして認識され、扱われます。</li>
+ <li><code>file://</code> の URL で JavaScript モジュールを実行することはできません。— <a href="/ja/docs/Web/HTTP/CORS">CORS</a> エラーになります。HTTP サーバーを通して実行する必要があります。</li>
+</ul>
+
+<h3 id="Using_the_default_export" name="Using_the_default_export">デフォルトエクスポートの使用</h3>
+
+<p>値をひとつエクスポートしたい、あるいはモジュールでフォールバック先の値を持ちたい場合は、デフォルトエクスポートを使用するとよいでしょう。</p>
+
+<pre class="brush: js notranslate">// module "my-module.js"
+
+export default function cube(x) {
+  return x * x * x;
+}
+</pre>
+
+<p>別のスクリプトからの、デフォルトエクスポートのインポートは簡単です。</p>
+
+<pre class="brush: js notranslate">import cube from './my-module.js';
+console.log(cube(3)); // 27
+</pre>
+
+<h3 id="Using_export_from" name="Using_export_from">export from の使用</h3>
+
+<p>以下のような階層がある場合を例に考えてみましょう。</p>
+
+<ul>
+ <li><code>childModule1.js</code>: <code>myFunction</code> および <code>myVariable</code> をエクスポート</li>
+ <li><code>childModule2.js</code>: <code>myClass</code> をエクスポート</li>
+ <li><code>parentModule.js</code>: 集約元として動作する (他には何もしない)</li>
+ <li>最上位モジュール: <code>parentModule.js</code> のエクスポートを利用する</li>
+</ul>
+
+<p>コードスニペットを使うとこのような感じになります。</p>
+
+<pre class="brush: js notranslate">// childModule1.js
+let myFunction = ...; // myFunction に役立つものを割り当てる
+let myVariable = ...; // myVariablemy に役立つものを割り当てる
+export {myFunction, myVariable};
+</pre>
+
+<pre class="brush: js notranslate">// childModule2.js
+let myClass = ...; // myClass に役立つものを代入する
+export myClass;
+</pre>
+
+<pre class="brush: js notranslate">// parentModule.js
+// childModule1 と childModule2 からのエクスポートを
+// 集約して再エクスポートする
+export { myFunction, myVariable } from 'childModule1.js';
+export { myClass } from 'childModule2.js';
+</pre>
+
+<pre class="brush: js notranslate">// 最上位モジュール
+// parentModule にモジュールが集約しているので、
+// 単一のモジュールからエクスポートを利用できます。
+import { myFunction, myVariable, myClass } from 'parentModule.js'</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.export")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/import", "import")}}</li>
+ <li><a href="/ja/docs/Web/JavaScript/Guide/Modules">JavaScript モジュール</a></li>
+ <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a> Jason Orendorff のブログ記事</li>
+ <li><a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">ES modules: A cartoon deep-dive</a> Lin Clark のブログ記事</li>
+ <li><a href="http://exploringjs.com/es6/ch_modules.html">Axel Rauschmayer's book: "Exploring JS: Modules"</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/for-await...of/index.html b/files/ja/web/javascript/reference/statements/for-await...of/index.html
new file mode 100644
index 0000000000..9d3102375c
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/for-await...of/index.html
@@ -0,0 +1,255 @@
+---
+title: for await...of
+slug: Web/JavaScript/Reference/Statements/for-await...of
+tags:
+  - Iterate
+  - Iteration
+  - JavaScript
+  - Reference
+  - Statement
+  - asynchronous
+  - await
+  - 文
+  - 繰り返し
+  - 非同期
+translation_of: Web/JavaScript/Reference/Statements/for-await...of
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>for await...of</code> 文</strong>は非同期および同期の<a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">反復可能オブジェクト</a>を使用して、反復処理を行うループを作成します。たとえば、組込みの {{jsxref("String")}}, {{jsxref("Array")}}, 配列風オブジェクト (例えば {{jsxref("Functions/arguments", "arguments")}}, {{domxref("NodeList")}} など), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, さらに、ユーザー定義の非同期・同期の反復可能オブジェクトを使用することができます。これはオブジェクトのそれぞれの識別可能なプロパティの値に対して、実行される文を表す独自の反復フックを呼び出します。 {{jsxref("Operators/await", "await")}} 演算子と同様に、この分は{{jsxref("Statements/async_function", "非同期関数", "", 1)}}の中でのみ使用されます。</p>
+
+<div class="blockIndicator note">
+<p><code>for await...of</code> は非同期の反復可能オブジェクトではない非同期イテレーターでは動作しません。</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">for await (<var>variable</var> of <var>iterable</var>) {
+  <var>statement</var>
+}
+</pre>
+
+<dl>
+ <dt><code><var>variable</var></code></dt>
+ <dd>反復処理の各回において、異なるプロパティの値が <code><var>variable</var></code> に割り当てられます。 <code><var>variable</var></code> は <code>const</code>, <code>let</code>, <code>var</code> で宣言することができます。</dd>
+ <dt><code><var>iterable</var></code></dt>
+ <dd>反復処理が行われる反復可能なプロパティを持つオブジェクトです。</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Iterating_over_async_iterables" name="Iterating_over_async_iterables">非同期の反復可能オブジェクトでの繰り返し処理</h3>
+
+<p>非同期反復可能プロトコルを明示的に実装しているオブジェクトを反復処理することができます。</p>
+
+<pre class="brush:js notranslate">const asyncIterable = {
+  [Symbol.asyncIterator]() {
+    return {
+      i: 0,
+      next() {
+        if (this.i &lt; 3) {
+          return Promise.resolve({ value: this.i++, done: false });
+        }
+
+        return Promise.resolve({ done: true });
+      }
+    };
+  }
+};
+
+(async function() {
+   for await (let num of asyncIterable) {
+     console.log(num);
+   }
+})();
+
+// 0
+// 1
+// 2
+</pre>
+
+<h3 id="Iterating_over_async_generators" name="Iterating_over_async_generators">非同期のジェネレータの反復処理</h3>
+
+<p>非同期の反復可能プロトコルを実装している非同期ジェネレーターであれば、 <code>for await...of</code> を使用して繰り返し処理を行うことができます。</p>
+
+<pre class="brush: js notranslate">async function* asyncGenerator() {
+  let i = 0;
+  while (i &lt; 3) {
+    yield i++;
+  }
+}
+
+(async function() {
+  for await (let num of asyncGenerator()) {
+    console.log(num);
+  }
+})();
+// 0
+// 1
+// 2</pre>
+
+<p><code>for await...of</code> を使用して非同期ジェネレータを反復処理するより具体的な例として、API からのデータを反復処理することを考えてみましょう。</p>
+
+<p>この例では、まずデータのストリームに対して非同期の反復可能オブジェクトを作成し、それを使用して API からのレスポンスの長さを計算します。</p>
+
+<pre class="brush: js notranslate">async function* streamAsyncIterable(stream) {
+  const reader = stream.getReader();
+  try {
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        return;
+      }
+      yield value;
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}
+// URL からデータを取得し、非同期ジェネレータを使用してレスポンスの長さを計算します。
+async function getResponseSize(url) {
+  const response = await fetch(url);
+  // レスポンスの長さをバイト単位で保持する
+  let responseSize = 0;
+  // for-await-of ループ。レスポンスの各部分を非同期に反復処理します。
+  for await (const chunk of streamAsyncIterable(response.body)) {
+    // レスポンスの全長に加算
+    responseSize += chunk.length;
+  }
+
+  console.log(`Response Size: ${responseSize} bytes`);
+  // 期待される出力: "Response Size: 1071472"
+  return responseSize;
+}
+getResponseSize('https://jsonplaceholder.typicode.com/photos');</pre>
+
+<h3 id="Iterating_over_sync_iterables_and_generators" name="Iterating_over_sync_iterables_and_generators">同期の反復可能オブジェクトおよびジェネレーターの反復処理</h3>
+
+<p><code>for await...of</code> ループは同期の反復可能オブジェクトやジェネレーターで使用することもできます。この場合、内部的にはループの制御変数に代入する前に、値が出力されるのを待ちます。</p>
+
+<pre class="brush: js notranslate">function* generator() {
+  yield 0;
+  yield 1;
+  yield Promise.resolve(2);
+  yield Promise.resolve(3);
+  yield 4;
+}
+
+(async function() {
+  for await (let num of generator()) {
+    console.log(num);
+  }
+})();
+// 0
+// 1
+// 2
+// 3
+// 4
+
+// for-of ループとの比較:
+
+for (let numOrPromise of generator()) {
+  console.log(numOrPromise);
+}
+// 0
+// 1
+// Promise { 2 }
+// Promise { 3 }
+// 4
+</pre>
+
+<div></div>
+
+<div class="blockIndicator note">
+<p><strong>注</strong>: 同期のジェネレーターから拒否されたプロミスが生み出される場合があることに注意してください。このような場合、 <code>for await...of</code> は拒否されたプロミスを消費するので、ジェネレーター内の <code>finally</code> ブロックが呼び出されません。これは、確保したリソースを <code>try/finally</code> で解放する必要がある場合は望ましくない動作になる可能性があります。</p>
+</div>
+
+<pre class="brush: js notranslate">function* generatorWithRejectedPromises() {
+  try {
+    yield 0;
+    yield 1;
+    yield Promise.resolve(2);
+    yield Promise.reject(3);
+    yield 4;
+    throw 5;
+  } finally {
+    console.log('called finally')
+  }
+}
+
+(async function() {
+  try {
+    for await (let num of generatorWithRejectedPromises()) {
+      console.log(num);
+    }
+  } catch (e) {
+    console.log('catched', e)
+  }
+})();
+// 0
+// 1
+// 2
+// catched 3
+
+// for-of ループとの比較:
+
+try {
+  for (let numOrPromise of generatorWithRejectedPromises()) {
+    console.log(numOrPromise);
+  }
+} catch (e) {
+  console.log('catched', e)
+}
+// 0
+// 1
+// Promise { 2 }
+// Promise { &lt;rejected&gt; 3 }
+// 4
+// catched 5
+// called finally
+</pre>
+
+<p>同期ジェネレーター関数の <code>finally</code> ブロックが常に呼び出されるようにするには、非同期のジェネレーター関数の場合は <code>for await...of</code> を、同期ジェネレーター関数の場合は <code>for...of</code> を使用し、ループの中で生成されたプロミスを明示的に待つようにしてください。</p>
+
+<pre class="brush: js notranslate">(async function() {
+  try {
+    for (let numOrPromise of generatorWithRejectedPromises()) {
+      console.log(await numOrPromise);
+    }
+  } catch (e) {
+    console.log('catched', e)
+  }
+})()
+// 0
+// 1
+// 2
+// catched 3
+// called finally</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'ECMAScript Language: The for-in, for-of, and for-await-of Statements')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.for_await_of")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/Symbol/asyncIterator", "Symbol.asyncIterator")}}</li>
+ <li>{{jsxref("Statements/for...of", "for...of")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/for...in/index.html b/files/ja/web/javascript/reference/statements/for...in/index.html
new file mode 100644
index 0000000000..91d7dbb6a2
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/for...in/index.html
@@ -0,0 +1,152 @@
+---
+title: for...in
+slug: Web/JavaScript/Reference/Statements/for...in
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/for...in
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>for...in</code> 文</strong>は、キーが文字列であるオブジェクトの<a href="/ja/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">列挙可能プロパティ</a>すべてに対して、継承された列挙可能プロパティも含めて反復処理を行います (<a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/Symbol">Symbol</a> がキーになったものは無視します)。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-forin.html")}}</div>
+
+
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">for (<var>variable</var> in <var>object</var>)
+  文</pre>
+
+<dl>
+ <dt><code><var>variable</var></code></dt>
+ <dd>反復するごとに、 <code><var>variable</var></code> に異なるプロパティ名が代入されます。</dd>
+ <dt><code><var>object</var></code></dt>
+ <dd>このオブジェクトの列挙可能プロパティに対して反復処理がされます。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>for...in</code> ループは、列挙可能なシンボル以外のプロパティに対してのみ反復処理を行います。 <code>Array</code> や <code>Object</code> のような組込みコンストラクターから生成したオブジェクトは、列挙可能でないプロパティを <code>Objet.prototype</code> や <code>String.prototype</code> から、例えば {{jsxref("String")}} の {{jsxref("String.indexOf", "indexOf()")}} メソッドや {{jsxref("Object")}} の {{jsxref("Object.toString", "toString()")}} メソッドを継承しています。このループは、対象オブジェクト自身とそのオブジェクトがプロトタイプから継承しているすべての列挙可能なプロパティを反復します (プロトタイプチェーンで対象オブジェクトに近いプロパティは、親プロトタイプのプロパティを上書きします)。</p>
+
+<h3 id="Deleted_added_or_modified_properties" name="Deleted_added_or_modified_properties">プロパティの変更や削除</h3>
+
+<p><code>for...in</code> ループは、任意の順序でオブジェクトのプロパティに対して反復します (なぜ繰り返しの見かけの順序に依存できないのかについては、詳細は {{jsxref("Operators/delete", "delete")}} 演算子を見てください)。</p>
+
+<p>もしプロパティがある反復で修正されて、その後に訪問されたなら、ループにより公開される値は後の時点での値となります。訪問される前に削除されたプロパティは、それから後には訪問されません。オブジェクトに対する反復が起きている中でそのオブジェクトに追加されたプロパティは、訪問されるかもしれませんし反復から省略されるかもしれません。</p>
+
+<p>一般的に、現在訪問しているプロパティ以外のものに関しては、反復の間はオブジェクトにプロパティを追加、修正、または削除しないのが一番です。追加したプロパティが訪問されるか、(現在のもの以外の)修正したプロパティが修正される前または後に訪問されるか、または削除したプロパティが削除される前に訪問されるかといったことには、何の保証もありません。</p>
+
+<h3 id="Array_iteration_and_for...in" name="Array_iteration_and_for...in">配列の繰り返しと for...in</h3>
+
+<div class="note">
+<p><strong>注:</strong> <code>for...in</code> はインデックスの順序が重要となる {{jsxref("Array", "配列")}} の繰り返しには使うべきではありません。</p>
+</div>
+
+<p>配列のインデックスは単に整数値の名前で列挙できるプロパティであり、そうでないと一般的なオブジェクトのプロパティとして一意になりません。 <code>for...in</code> は特定の順序で並べられる保証はありません。 <code>for...in</code> ループ文はすべての列挙できるプロパティを返し、その中には非整数型やそれを引き継いだインデックス名があります。</p>
+
+<p>繰り返しの順序が実装依存なため、配列の繰り返しは要素を一貫した順番で参照することになるとは限りません。このため、アクセスの順番が大事となる配列を繰り返す時には、数値のインデックスでの {{jsxref("Statements/for", "for")}} ループ (か {{jsxref("Array.prototype.forEach()")}} か {{jsxref("Statements/for...of", "for...of")}} ループ) を使った方が良いです。</p>
+
+<h3 id="Iterating_over_own_properties_only" name="Iterating_over_own_properties_only">独自のプロパティだけで繰り返す</h3>
+
+<p>オブジェクトに付属するプロパティだけを考えればよい場合、 {{jsxref("Object.getOwnPropertyNames", "getOwnPropertyNames()")}} を使うか、 {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} を実行してチェックします({{jsxref("Object.prototype.propertyIsEnumerable", "propertyIsEnumerable")}} も使用できます)。または、外部のコードインターフェイスをまったく知らない場合は、チェックメソッドを備えた組み込みの prototypes を継承できます。</p>
+
+<h2 id="Why_Use_for...in" name="Why_Use_for...in">for...in を使用する理由</h2>
+
+<p><code>for...in</code> はオブジェクトのプロパティを反復するために作られたものであり、配列での使用は推奨されず、 <code>Array.prototype.forEach()</code> や <code>for...of</code> などの選択肢があるわけですが、それでは <code>for...in</code> を使用する場面は何なのでしょうか？</p>
+
+<p>最も具体的な使い方はデバッグ目的であるかもしれません。これは、オブジェクトのプロパティを (コンソールに出力するなどして) 簡単にチェックする方法になります。データを格納するには配列の方が実用的な場合が多いですが、データを扱うにはキーと値のペアが好まれる状況では (プロパティが "キー" として機能します)、それらのキーが特定の値を保持しているかどうかをチェックしたい場合があるかもしれません。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_for...in" name="Using_for...in">for...in の使用</h3>
+
+<p>以下の <code>for...in</code> ループは、オブジェクトの列挙可能なシンボルではないプロパティをすべて反復し、そのプロパティ名と値を文字列で記録します。</p>
+
+<pre class="brush: js notranslate">var obj = {a: 1, b: 2, c: 3};
+
+for (const prop in obj) {
+  console.log(`obj.${prop} = ${obj[prop]}`);
+}
+
+// Output:
+// "obj.a = 1"
+// "obj.b = 2"
+// "obj.c = 3"</pre>
+
+<h3 id="Iterating_own_properties" name="Iterating_own_properties">自身のプロパティの反復処理</h3>
+
+<p>次の関数では {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}}: の使い方を例示しています。継承されたプロパティは表示されません。</p>
+
+<pre class="brush: js notranslate">var triangle = {a: 1, b: 2, c: 3};
+
+function ColoredTriangle() {
+  this.color = 'red';
+}
+
+ColoredTriangle.prototype = triangle;
+
+var obj = new ColoredTriangle();
+
+for (const prop in obj) {
+  if (obj.hasOwnProperty(prop)) {
+    console.log(`obj.${prop} = ${obj[prop]}`);
+  }
+}
+
+// Output:
+// "obj.color = red"
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...in statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.for_in")}}</p>
+
+<h3 id="Compatibility_Initializer_expressions_in_strict_mode" name="Compatibility_Initializer_expressions_in_strict_mode">厳格モードにおける初期化式の互換性について</h3>
+
+<p>Firefox 40 より前では、<code>for...in</code> ループ内で初期化式 (<code>i=0</code>) が使用可能でした。</p>
+
+<pre class="brush: js example-bad notranslate">var obj = {a: 1, b: 2, c: 3};
+for (var i = 0 in obj) {
+  console.log(obj[i]);
+}
+// 1
+// 2
+// 3
+</pre>
+
+<p>この標準外の動作はバージョン 40 以降では無視され、<a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a>での {{jsxref("SyntaxError")}} ("<a href="/ja/docs/Web/JavaScript/Reference/Errors/Invalid_for-in_initializer">for-in loop head declarations may not have initializers</a>") エラーが表示されます (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=748550">bug 748550</a> および <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1164741">bug 1164741</a>)。</p>
+
+<p>v8 (Chrome), Chakra (IE/Edge), JSC (WebKit/Safari) といった他のエンジンも同様に非標準のふるまいを削除するよう開発しています。</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/for...of", "for...of")}} - プロパティ値に対して繰り返す同様の文</li>
+ <li>{{jsxref("Statements/for_each...in", "for each...in")}} - <code>for...in</code> に似ていますが、プロパティ名そのものではなく、オブジェクトのプロパティの値に対して反復します。(廃止されました)</li>
+ <li>{{jsxref("Statements/for", "for")}}</li>
+ <li><a href="/ja/docs/Web/JavaScript/Guide/Iterators_and_Generators">ジェネレーター式</a> (<code>or...in</code> を使っている)</li>
+ <li><a href="/ja/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">プロパティの列挙可能性と所有権</a></li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li>{{jsxref("Object.prototype.hasOwnProperty()")}}</li>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/for...of/index.html b/files/ja/web/javascript/reference/statements/for...of/index.html
new file mode 100644
index 0000000000..cc6e37bc21
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/for...of/index.html
@@ -0,0 +1,315 @@
+---
+title: for...of
+slug: Web/JavaScript/Reference/Statements/for...of
+tags:
+  - ECMAScript 2015
+  - ES6
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/for...of
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>for...of</code> 文</strong>は、<a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">反復可能オブジェクト</a>、たとえば組込みの {{jsxref("String")}}, {{jsxref("Array")}}, 配列状オブジェクト (例えば {{jsxref("Functions/arguments", "arguments")}} や {{domxref("NodeList")}}), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, およびユーザー定義の反復可能オブジェクトなどに対して、反復的な処理をするループを作成します。これはオブジェクトのそれぞれの識別可能なプロパティの値に対して、実行される文を表す独自の反復フックを呼び出します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-forof.html")}}</div>
+
+<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">for (<var>variable</var> of <var>iterable</var>) {
+  <var>statement</var>
+}
+</pre>
+
+<dl>
+ <dt><code><var>variable</var></code></dt>
+ <dd>反復処理の各回において、異なるプロパティの値が <code><var>variable</var></code> に割り当てられます。<code><var>variable</var></code> は <code>const</code>, <code>let</code>, <code>var</code> で宣言することができます。</dd>
+ <dt><code><var>iterable</var></code></dt>
+ <dd>反復処理が行われる反復可能なプロパティを持つオブジェクトです。</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Iterating_over_an_jsxrefArray" name="Iterating_over_an_jsxrefArray">{{jsxref("Array")}} での反復処理</h3>
+
+<pre class="brush:js notranslate">const iterable = [10, 20, 30];
+
+for (const value of iterable) {
+  console.log(value);
+}
+// 10
+// 20
+// 30
+</pre>
+
+<p>{{jsxref("let")}} を {{jsxref("const")}} の代わりに使用しても、ブロック内で変数が再割り当てされます。</p>
+
+<pre class="brush:js notranslate">const iterable = [10, 20, 30];
+
+for (let value of iterable) {
+  value += 1;
+  console.log(value);
+}
+// 11
+// 21
+// 31
+</pre>
+
+<h3 id="Iterating_over_a_jsxrefString" name="Iterating_over_a_jsxrefString">{{jsxref("String")}} での反復処理</h3>
+
+<pre class="brush:js notranslate">const iterable = 'boo';
+
+for (const value of iterable) {
+  console.log(value);
+}
+// "b"
+// "o"
+// "o"
+</pre>
+
+<h3 id="Iterating_over_a_jsxrefTypedArray" name="Iterating_over_a_jsxrefTypedArray">{{jsxref("TypedArray")}} での反復処理</h3>
+
+<pre class="brush:js notranslate">const iterable = new Uint8Array([0x00, 0xff]);
+
+for (const value of iterable) {
+  console.log(value);
+}
+// 0
+// 255
+</pre>
+
+<h3 id="Iterating_over_a_jsxrefMap" name="Iterating_over_a_jsxrefMap">{{jsxref("Map")}} での反復処理</h3>
+
+<pre class="brush:js notranslate">const iterable = new Map([['a', 1], ['b', 2], ['c', 3]]);
+
+for (const entry of iterable) {
+  console.log(entry);
+}
+// ['a', 1]
+// ['b', 2]
+// ['c', 3]
+
+for (const [key, value] of iterable) {
+  console.log(value);
+}
+// 1
+// 2
+// 3
+</pre>
+
+<h3 id="Iterating_over_a_jsxrefSet" name="Iterating_over_a_jsxrefSet">{{jsxref("Set")}} での反復処理</h3>
+
+<pre class="brush:js notranslate">const iterable = new Set([1, 1, 2, 2, 3, 3]);
+
+for (const value of iterable) {
+  console.log(value);
+}
+// 1
+// 2
+// 3
+</pre>
+
+<h3 id="Iterating_over_the_jsxrefarguments_object" name="Iterating_over_the_jsxref(arguments)_object">arguments オブジェクトでの反復処理</h3>
+
+<p>{{jsxref("Functions/arguments", "arguments")}} オブジェクトで反復処理をすると、ある JavaScript 関数にすべての引数を渡すことができます。</p>
+
+<pre class="brush: js notranslate">(function() {
+  for (const argument of arguments) {
+    console.log(argument);
+  }
+})(1, 2, 3);
+
+// 1
+// 2
+// 3</pre>
+
+<h3 id="Iterating_over_a_DOM_collection" name="Iterating_over_a_DOM_collection">DOM コレクションでの反復処理</h3>
+
+<p>{{domxref("NodeList")}} のような DOM コレクションでの反復処理です。次の例では、<code>read</code> クラスを <code>article</code> の直下の子である段落に加えます。</p>
+
+<pre class="brush:js notranslate">// 注: これは以下のものに対応しているプラットフォームでのみ動作します。
+// implemented NodeList.prototype[Symbol.iterator]
+const articleParagraphs = document.querySelectorAll('article &gt; p');
+
+for (const paragraph of articleParagraphs) {
+  paragraph.classList.add('read');
+}
+</pre>
+
+<h3 id="Closing_iterators" name="Closing_iterators">反復処理の終了</h3>
+
+<p><code>for...of</code> ループ内では、<code>break</code>, <code>throw</code>, <code>return</code> を発生させることで反復処理を中断させることができます。この場合、反復子は閉じられます。</p>
+
+<pre class="brush: js notranslate">function* foo(){
+  yield 1;
+  yield 2;
+  yield 3;
+};
+
+for (const o of foo()) {
+  console.log(o);
+  break; // 反復処理を閉じ、ループの外の実行が継続されます
+}
+console.log('done');
+</pre>
+
+<h3 id="Iterating_over_generators" name="Iterating_over_generators">ジェネレーターでの反復処理</h3>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Statements/function*">ジェネレーター</a>、すなわち反復可能オブジェクトを生成する関数で反復処理することもできます。</p>
+
+<pre class="brush:js notranslate">function* fibonacci() { // ジェネレーター関数
+  let [prev, curr] = [0, 1];
+  while (true) {
+    [prev, curr] = [curr, prev + curr];
+    yield curr;
+  }
+}
+
+for (const n of fibonacci()) {
+  console.log(n);
+  // 1000 で繰り返しを終了する
+  if (n &gt;= 1000) {
+    break;
+  }
+}
+</pre>
+
+<h4 id="Do_not_reuse_generators" name="Do_not_reuse_generators">ジェネレーターを再利用してはいけない</h4>
+
+<p>ジェネレーターは、<code>for...of</code> ループが {{jsxref("Statements/break", "break")}} キーワードなどで早く終了しても再利用してはいけません。ループを抜けると、ジェネレーターは閉じられ、そこで繰り返してもそれ以上の結果は算出されません。</p>
+
+<pre class="brush: js example-bad notranslate">const gen = (function *(){
+  yield 1;
+  yield 2;
+  yield 3;
+})();
+for (const o of gen) {
+  console.log(o);
+  break;  // 反復処理を閉じる
+}
+
+// ジェネレーターを再利用してはいけません。以下の処理は意味がありません。
+for (const o of gen) {
+  console.log(o); // Never called.
+}
+</pre>
+
+<h3 id="Iterating_over_other_iterable_objects" name="Iterating_over_other_iterable_objects">その他の反復可能オブジェクトでの反復処理</h3>
+
+<p>明示的に <a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols#iterable">iterable</a> プロトコルを実装しているオブジェクトで反復処理することもできます。</p>
+
+<pre class="brush:js notranslate">const iterable = {
+  [Symbol.iterator]() {
+    return {
+      i: 0,
+      next() {
+        if (this.i &lt; 3) {
+          return { value: this.i++, done: false };
+        }
+        return { value: undefined, done: true };
+      }
+    };
+  }
+};
+
+for (const value of iterable) {
+  console.log(value);
+}
+// 0
+// 1
+// 2
+</pre>
+
+<h3 id="Difference_between_for...of_and_for...in" name="Difference_between_for...of_and_for...in"><code>for...of</code> と <code>for...in</code> との違い</h3>
+
+<p><code>for...in</code> および <code>for...of</code> 文は、両方とも何かに対する繰り返しです。これらの主な違いは何に対する繰り返しなのかというところです。</p>
+
+<p>{{jsxref("Statements/for...in", "for...in")}} 文は、オブジェクトのすべての<a href="/ja/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">列挙可能なプロパティ</a>に対して、順序不定で繰り返し処理を行います。</p>
+
+<p><code>for...of</code> 文は、<a href="/ja/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterables">反復可能なオブジェクト</a>が定義した順序で値を反復処理します。</p>
+
+<p>次の例では、{{jsxref("Array")}} に対して <code>for...of</code> ループと <code>for...in</code> ループを使用した場合の違いを示しています。</p>
+
+<pre class="brush:js notranslate">Object.prototype.objCustom = function() {};
+Array.prototype.arrCustom = function() {};
+
+const iterable = [3, 5, 7];
+iterable.foo = 'hello';
+
+for (const i in iterable) {
+  console.log(i); // logs 0, 1, 2, "foo", "arrCustom", "objCustom"
+}
+
+for (const i in iterable) {
+  if (iterable.hasOwnProperty(i)) {
+    console.log(i); // logs 0, 1, 2, "foo"
+  }
+}
+
+for (const i of iterable) {
+  console.log(i); // logs 3, 5, 7
+}
+</pre>
+
+<p>上記のコードをステップを追って見ていきましょう。</p>
+
+<pre class="brush: js notranslate">Object.prototype.objCustom = function() {};
+Array.prototype.arrCustom = function() {};
+
+const iterable = [3, 5, 7];
+iterable.foo = 'hello';</pre>
+
+<p>すべてのオブジェクトは <code>objCustom</code> プロパティを継承し、すべての {{jsxref("Array")}} オブジェクトは <code>arrCustom</code> プロパティを継承します。{{jsxref("Object.prototype")}} と {{jsxref("Array.prototype")}} にそれぞれこれらのプロパティを追加されているためです。オブジェクト <code>iterable</code> は <code>objCustom</code> と <code>arrCustom</code> の各プロパティを、<a href="/ja/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">継承とプロトタイプチェーン</a>によって継承しています。</p>
+
+<pre class="brush: js notranslate">for (const i in iterable) {
+  console.log(i); // 0, 1, 2, "foo", "arrCustom", "objCustom" と出力
+}</pre>
+
+<p>このループは <code>iterable</code> オブジェクトの<a href="/ja/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">列挙可能なプロパティ</a>のみを、順序不定で出力します。配列の<strong>要素</strong>である <code>3</code>, <code>5</code>, <code>7</code> や <code>hello</code> は、列挙可能なプロパティ<strong>ではない</strong>ため出力しません。実際、これらはプロパティではなく、値です。配列の<strong>添字</strong>が <code>arrCustom</code> や <code>objCustom</code> と共に出力されます。なぜプロパティが反復処理に出てこないのかが分からない場合は、{{jsxref("Statements/for...in", "array iteration and for...in", "#Array_iteration_and_for...in")}} にもっと詳しい説明があります。</p>
+
+<pre class="brush: js notranslate">for (const i in iterable) {
+  if (iterable.hasOwnProperty(i)) {
+    console.log(i); // 0, 1, 2, "foo" と出力
+  }
+}</pre>
+
+<p>このループは最初のものと似ていますが、{{jsxref("Object.prototype.hasOwnProperty()", "hasOwnProperty()")}} を使用して見つかった列挙可能なプロパティがオブジェクト自身のものであるか、すなわち継承したものでないかどうかをチェックしています。オブジェクト自身のプロパティである場合は、ログ出力します。<code>0</code>, <code>1</code>, <code>2</code>, <code>foo</code> は自身のプロパティである (<strong>継承されたものではない</strong>) ため出力されます。<code>arrCustom</code> と <code>objCustom</code> は<strong>継承されたものである</strong>ために出力されません。</p>
+
+<pre class="brush: js notranslate">for (const i of iterable) {
+  console.log(i); // 3, 5, 7 と出力
+}</pre>
+
+<p>このループは、<code>iterable</code> が<a href="/ja/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterables">反復可能なオブジェクト</a>として定義している順序で<strong>値</strong>を反復処理し、ログ出力します。オブジェクトの<strong>要素</strong>である <code>3</code>, <code>5</code>, <code>7</code> は表示されますが、オブジェクトの<strong>プロパティ</strong>は表示されません。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...of statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.for_of")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Map.prototype.forEach()")}}</li>
+ <li>{{jsxref("Object.entries()")}} – オブジェクトに <strong><code>for...of</code></strong> を使用するときに便利です。</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/for/index.html b/files/ja/web/javascript/reference/statements/for/index.html
new file mode 100644
index 0000000000..7176551fc5
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/for/index.html
@@ -0,0 +1,146 @@
+---
+title: for
+slug: Web/JavaScript/Reference/Statements/for
+tags:
+  - JavaScript
+  - Language feature
+  - Loop
+  - Reference
+  - Statement
+  - for
+translation_of: Web/JavaScript/Reference/Statements/for
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>for 文</strong>は、括弧で囲みセミコロンで区切った3つの引数と、続いてループ内で実行される文 (ふつうは<a href="/ja/docs/Web/JavaScript/Reference/Statements/block">ブロック文</a>) から成るループを構成します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-for.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">for ([<var>initialization</var>]; [<var>condition</var>]; [<var>final-expression</var>])
+   <var>statement</var></pre>
+
+<dl>
+ <dt><code><var>initialization</var></code></dt>
+ <dd>ループが始まる前に一度だけ評価される (代入式を含む) 式または変数宣言。ふつうはカウンター変数を初期化するために使われます。この式では任意で、 <code>var</code> キーワードを用いて新しい変数を宣言することもできます。 <code>var</code> で宣言された変数はループ内のローカル変数にはなりません。すなわち、 <code>for</code> ループが属するスコープと同じスコープになります。 <code>let</code> で宣言された変数は文内のローカル変数になります。</dd>
+ <dd>この式の結果は捨て去られます。</dd>
+ <dt><code><var>condition</var></code></dt>
+ <dd>ループのそれぞれの反復処理が行われる前に評価される式です。この式が true と評価された場合は、 <code><var>statement</var></code> が実行されます。この条件テストは省略可能です。省略された場合は、条件は常に true に評価されます。もしこの式が false と評価された場合は、実行は <code>for</code> 構造に続く最初の式に飛びます。</dd>
+ <dt><code><var>final-expression</var></code></dt>
+ <dd>ループのそれぞれの反復処理の最後に評価される式です。これは、次の <code><var>condition</var></code> の評価前に行われます。一般的には、カウンター変数を更新または増加するために使われます。</dd>
+ <dt><code><var>statement</var></code></dt>
+ <dd>条件が true と評価された場合に限り実行される文です。ループ内で複数の文を実行するには、{{jsxref("Statements/block", "ブロック", "", 0)}}文 (<code>{ ... }</code>) を使用して文をグループ化してください。ループ内で文を実行しないようにするには、{{jsxref("Statements/empty", "空文", "", 0)}} (<code>;</code>) を使用してください。</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_for" name="Using_for">for の使用</h3>
+
+<p>次の <code>for</code> 文は、変数 <code>i</code> を宣言し、それを <code>0</code> に初期化することから始まります。<code>i</code> が 9 より小さいことをチェックし、続く 2 つの文を実行し、ループを通過した後ごとに <code>i</code> を 1 増加します。</p>
+
+<pre class="brush: js notranslate">for (let i = 0; i &lt; 9; i++) {
+   console.log(i);
+   // その他の文
+}
+</pre>
+
+<h3 id="Optional_for_expressions" name="Optional_for_expressions">省略可能な for の式</h3>
+
+<p><code>for</code> ループの先頭にある 3 つの式は、省略可能です。</p>
+
+<p>例えば、 <code><var>initialization</var></code> ブロックで変数を初期化する必要はありません。</p>
+
+<pre class="brush: js notranslate">var i = 0;
+for (; i &lt; 9; i++) {
+    console.log(i);
+    // その他の文
+}
+</pre>
+
+<p><code><var>initialization</var></code> ブロックと同様に、 <code><var>condition</var></code> ブロックも省略可能です。この式を省略した場合は、本体の中でループを脱出できるようにして、無限ループにならないようにしなければなりません。</p>
+
+<pre class="brush: js notranslate">for (let i = 0;; i++) {
+   console.log(i);
+   if (i &gt; 3) break;
+   // その他の文
+}</pre>
+
+<p>3 つのブロックをすべて省略することもできます。繰り返しますが、 {{jsxref("Statements/break", "break")}} 文を使用してループを終了させ、また break 文の条件がある時点で true になるように、変数を変更 (増加) させていることを確認してください。</p>
+
+<pre class="brush: js notranslate">var i = 0;
+
+for (;;) {
+  if (i &gt; 3) break;
+  console.log(i);
+  i++;
+}
+</pre>
+
+<h3 id="Using_for_without_a_statement" name="Using_for_without_a_statement">文を持たない for の使用</h3>
+
+<p>以下の <code>for</code> の繰り返しでは、 <code><var>final-expression</var></code> 句の中でにおけるノードのオフセット位置を検索しています。 <code><var>statement</var></code> 節を使用する必要がない場合は、代わりにセミコロンを使用してください。</p>
+
+<pre class="brush: js notranslate">function showOffsetPos(sId) {
+
+  var nLeft = 0, nTop = 0;
+
+  for (
+
+    var oItNode = document.getElementById(sId); /* initialization */
+
+    oItNode; /* condition */
+
+    nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent /* final-expression */
+
+  ); /* semicolon */
+
+  console.log('Offset position of \'' + sId + '\' element:\n left: ' + nLeft + 'px;\n top: ' + nTop + 'px;');
+
+}
+
+/* 呼び出しの例 */
+
+showOffsetPos('content');
+
+// Output:
+// "Offset position of "content" element:
+// left: 0px;
+// top: 153px;"</pre>
+
+<div class="note"><strong>注:</strong> これは、<strong>セミコロンが必須</strong>となる JavaScript の数少ないケースの1つです。セミコロンがないと、繰り返し宣言の次の行が繰り返す文と見なされます。</div>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-statement', 'for statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.for")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/empty", "空文", "", 0)}}</li>
+ <li>{{jsxref("Statements/break", "break")}}</li>
+ <li>{{jsxref("Statements/continue", "continue")}}</li>
+ <li>{{jsxref("Statements/while", "while")}}</li>
+ <li>{{jsxref("Statements/do...while", "do...while")}}</li>
+ <li>{{jsxref("Statements/for...in", "for...in")}}</li>
+ <li>{{jsxref("Statements/for...of", "for...of")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/for_each...in/index.html b/files/ja/web/javascript/reference/statements/for_each...in/index.html
new file mode 100644
index 0000000000..72df003bfb
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/for_each...in/index.html
@@ -0,0 +1,81 @@
+---
+title: for each...in
+slug: Web/JavaScript/Reference/Statements/for_each...in
+tags:
+  - Deprecated
+  - E4X
+  - JavaScript
+  - Obsolete
+  - Statement
+translation_of: Archive/Web/JavaScript/for_each...in
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<div class="warning">
+<p><code>for each...in</code> 文は ECMA-357 (<a href="/ja/docs/Archive/Web/E4X" title="E4X">E4X</a>) の一部として廃止されました。E4X のサポートは削除されました。代替として、<a href="/ja/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a> 文が推奨されます。<br>
+ <br>
+ <strong>Firefox は <code>for each...in</code> の使用に対して警告を表示します。また、Firefox 57 以降では動作しません。<br>
+ 移行のためのヘルプとして <a href="/ja/docs/Web/JavaScript/Reference/Errors/For-each-in_loops_are_deprecated">Warning: JavaScript 1.6's for-each-in loops are deprecated</a> をご覧ください。</strong></p>
+</div>
+
+<p><code><strong>for each...in</strong></code><strong> 文</strong>は指定された変数を、オブジェクトの全プロパティの値に対して反復します。異なるそれぞれのプロパティに対し、指定された文が実行されます。</p>
+
+<h2 id=".E6.A7.8B.E6.96.87" name=".E6.A7.8B.E6.96.87">構文</h2>
+
+<pre class="syntaxbox">for each (<em>variable</em> in <em>object</em>) {
+  <em>statement</em>
+}</pre>
+
+<dl>
+ <dt><code>variable</code></dt>
+ <dd>任意で <code>var</code> キーワードを用いて宣言された、プロパティの値に対して反復する変数。この変数はループにではなく、関数にローカルです。</dd>
+</dl>
+
+<dl>
+ <dt><code>object</code></dt>
+ <dd>プロパティが反復されるオブジェクト。</dd>
+</dl>
+
+<dl>
+ <dt><code>statement</code></dt>
+ <dd>各プロパティに対して実行する文。ループ内で複数の文を実行するには、それらの文をグループ化するために <a href="/ja/docs/Web/JavaScript/Reference/Statements/block">ブロック</a> 文 (<code>{ ... }</code>) を使ってください。</dd>
+</dl>
+
+<h2 id=".E8.AA.AC.E6.98.8E" name=".E8.AA.AC.E6.98.8E">説明</h2>
+
+<p>ある組み込みプロパティに対しては反復されません。これらには、たとえば <code>String</code> の <code>indexOf</code> メソッドといった、オブジェクトのすべての組み込みメソッドが含まれます。しかしながら、すべてのユーザー定義プロパパティに対しては反復されます。</p>
+
+<h2 id=".E4.BE.8B" name=".E4.BE.8B">例</h2>
+
+<h3 id=".E4.BE.8B:_for_each...in_.E3.82.92.E4.BD.BF.E3.81.86" name=".E4.BE.8B:_for_each...in_.E3.82.92.E4.BD.BF.E3.81.86">例: <code>for each...in</code> を使う</h3>
+
+<p><strong>警告</strong>: このようなループを決して配列に使わないでください。オブジェクトにだけ使ってください。詳しくは <a href="/ja/docs/Web/JavaScript/Reference/Statements/for...in"><code>for...in</code></a> をご覧ください。</p>
+
+<p>次のスニペットはオブジェクトのプロパティに対して反復し、それらの合計を計算します:</p>
+
+<pre class="brush:js">var sum = 0;
+var obj = {prop1: 5, prop2: 13, prop3: 8};
+
+for each (var item in obj) {
+  sum += item;
+}
+
+console.log(sum); // logs "26", which is 5+13+8</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<p>現行の ECMA-262 仕様には含まれていません。JavaScript 1.6 で実装され、非推奨になりました。</p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>
+
+
+
+<p>{{Compat("javascript.statements.for_each_in")}}</p>
+
+<h2 id=".E5.8F.82.E7.85.A7" name=".E5.8F.82.E7.85.A7">参照</h2>
+
+<ul>
+ <li><code><a href="/ja/docs/Web/JavaScript/Reference/Statements/for...in" title="JavaScript/Reference/Statements/for...in">for...in</a></code> - プロパティ<em>名</em> に対して反復する似たような文。</li>
+ <li><code><a href="/ja/docs/Web/JavaScript/Reference/Statements/for...of" title="JavaScript/Reference/Statements/for...of">for...of</a></code> - プロパティの<em>値</em>に対して反復しますが、一般的なオブジェクトではなく反復可能な型に対してのみ使用できる似たような文。</li>
+ <li><code><a href="/ja/docs/JavaScript/Reference/Statements/for" title="JavaScript/Reference/Statements/for">for</a></code></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/function/index.html b/files/ja/web/javascript/reference/statements/function/index.html
new file mode 100644
index 0000000000..8db65175e7
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/function/index.html
@@ -0,0 +1,158 @@
+---
+title: 関数宣言
+slug: Web/JavaScript/Reference/Statements/function
+tags:
+  - Function
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/function
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>関数宣言</strong> (関数文) は、指定された引数を使用して関数を定義します。</p>
+
+<p>また、 {{jsxref("Function")}} のコンストラクターと{{jsxref("Operators/function", "関数式", "", 1)}}を使用して関数を定義することもできます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-function.html","shorter")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">function <var>name</var>([<var>param</var>[, <var>param</var>,[..., <var>param</var>]]]) {
+   [<var>statements</var>]
+}
+</pre>
+
+<dl>
+ <dt><code><var>name</var></code></dt>
+ <dd>関数の名前です。</dd>
+</dl>
+
+<dl>
+ <dt><code><var>param</var></code> {{optional_inline}}</dt>
+ <dd>関数に渡す引数の名前です。引数の最大数はエンジンによって異なります。</dd>
+</dl>
+
+<dl>
+ <dt><code><var>statements</var></code> {{optional_inline}}</dt>
+ <dd>関数の本体を構成する文です。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>関数宣言で作成された関数は <code>Function</code> オブジェクトであり、<code>Function</code> オブジェクトのすべてのプロパティ、メソッド、動作を備えています。関数の詳細については {{jsxref("Function")}} を参照してください。</p>
+
+<p>関数は式を使用して作成することもできます ({{jsxref("Operators/function", "関数式", "", 1)}}を参照)。</p>
+
+<p>既定では、関数は <code>undefined</code> を返します。他の値を返すには、関数に返す値を指定する {{jsxref("Statements/return", "return")}} 文が必要です。</p>
+
+<h3 id="Conditionally_created_functions" name="Conditionally_created_functions">条件付きで作成される関数</h3>
+
+<p>関数は条件付きで宣言できます。つまり、関数文を <code>if</code> 文の中に入れ子にすることができますが、結果は実装によって一貫性がないので、このパターンを本番コードでは使用すべきではありません。条件付きの関数の作成には、代わりに関数式を使用してください。</p>
+
+<pre class="brush: js notranslate">var hoisted = "foo" in this;
+console.log(`'foo' name ${hoisted ? "is" : "is not"} hoisted. typeof foo is ${typeof foo}`);
+if (false) {
+  function foo(){ return 1; }
+}
+
+// In Chrome:
+// 'foo' name is hoisted. typeof foo is undefined
+//
+// In Firefox:
+// 'foo' name is hoisted. typeof foo is undefined
+//
+// In Edge:
+// 'foo' name is not hoisted. typeof foo is undefined
+//
+// In Safari:
+// 'foo' name is hoisted. typeof foo is function
+</pre>
+
+<p>真と評価される条件でも結果はまったく同じです。</p>
+
+<pre class="brush: js notranslate">var hoisted = "foo" in this;
+console.log(`'foo' name ${hoisted ? "is" : "is not"} hoisted. typeof foo is ${typeof foo}`);
+if (true) {
+  function foo(){ return 1; }
+}
+
+// In Chrome:
+// 'foo' name is hoisted. typeof foo is undefined
+//
+// In Firefox:
+// 'foo' name is hoisted. typeof foo is undefined
+//
+// In Edge:
+// 'foo' name is not hoisted. typeof foo is undefined
+//
+// In Safari:
+// 'foo' name is hoisted. typeof foo is function
+</pre>
+
+<h3 id="Function_declaration_hoisting" name="Function_declaration_hoisting">関数宣言の巻き上げ</h3>
+
+<p>JavaScript の関数宣言は、それを囲む関数やグローバルスコープの先頭に巻き上げられ、関数を宣言する前に使うことができます。</p>
+
+<pre class="brush: js notranslate">hoisted(); // logs "foo"
+
+function hoisted() {
+  console.log('foo');
+}
+</pre>
+
+<p>{{jsxref("Operators/function", "関数式", "", 1)}}は巻き上げられないことに注意してください。</p>
+
+<pre class="brush: js notranslate">notHoisted(); // TypeError: notHoisted is not a function
+
+var notHoisted = function() {
+   console.log('bar');
+};
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_function" name="Using_function">function の使用</h3>
+
+<p>以下のコードは、商品 <code>a</code>, <code>b</code>, <code>c</code> の販売個数が与えられた場合に、販売個数の合計を返す関数を宣言しています。</p>
+
+<pre class="brush: js notranslate">function calc_sales(units_a, units_b, units_c) {
+   return units_a * 79 + units_b * 129 + units_c * 699;
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function definitions')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.function")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Function")}}</li>
+ <li>{{jsxref("Operators/function", "関数式", "", 1)}}</li>
+ <li>{{jsxref("Statements/function*", "function* 文", "", 1)}}</li>
+ <li>{{jsxref("Operators/function*", "function* 式", "", 1)}}</li>
+ <li>{{jsxref("Functions/Arrow_functions", "アロー関数", "", 1)}}</li>
+ <li>{{jsxref("GeneratorFunction")}}</li>
+ <li>{{jsxref("Statements/async_function", "非同期関数", "", 1)}}</li>
+ <li>{{jsxref("Operators/async_function", "非同期関数式", "", 1)}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/function_star_/index.html b/files/ja/web/javascript/reference/statements/function_star_/index.html
new file mode 100644
index 0000000000..60daf7a7b9
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/function_star_/index.html
@@ -0,0 +1,258 @@
+---
+title: function* 宣言
+slug: Web/JavaScript/Reference/Statements/function*
+tags:
+  - ECMAScript 2015
+  - Function
+  - Iterator
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/function*
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><code><strong>function*</strong></code> 宣言 (<code>function</code> キーワードにアスタリスクが付いたもの) は、 {{jsxref("Global_Objects/Generator","Generator")}} オブジェクトを返すジェネレーター関数を定義します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-functionasterisk.html")}}</div>
+
+
+
+<p>ジェネレーター関数は {{jsxref("GeneratorFunction")}} コンストラクターや、関数式の構文を使用して定義することもできます。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">function* <var>name</var>([<var>param</var>[, <var>param</var>[, ... <var>param</var>]]]) {
+   <var>statements</var>
+}
+</pre>
+
+<dl>
+ <dt><code><var>name</var></code></dt>
+ <dd>関数名。</dd>
+ <dt><code><var>param</var></code> {{optional_inline}}</dt>
+ <dd>関数の形式上の引数の名前。</dd>
+ <dt><code><var>statements</var></code></dt>
+ <dd>関数の本体を構成する文。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>ジェネレーターは処理を抜け出したり、後から復帰したりすることができる関数です。ジェネレーターのコンテキスト (変数の値)は復帰しても保存されます。</p>
+
+<p>JavaScript のジェネレータは、特にプロミスと組み合わせることで、非同期プログラミングのための非常に強力なツールとなり、 <a href="http://callbackhell.com/">Callback Hell</a> や <a href="https://frontendmasters.com/courses/rethinking-async-js/callback-problems-inversion-of-control/">Inversion of Control</a> などのようなコールバックの問題を、完全に解決できるわけではないものの、軽減することができます。しかし、これらの問題は{{jsxref("Statements/async_function", "非同期関数", "", 1)}}を使用すると、さらにシンプルに解決することができます。</p>
+
+<p>ジェネレーター関数を呼び出しても関数はすぐには実行されません。代わりに、関数のための<a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols#iterator">イテレーター</a>オブジェクトが返されます。イテレーターの <code>next()</code> メソッドが呼び出されると、ジェネレーター関数の処理は、イテレーターから返された値を特定する最初の {{jsxref("Operators/yield", "yield")}} 演算子か、ほかのジェネレーター関数に委任する {{jsxref("Operators/yield*", "yield*")}} に達するまで実行されます。 <code>next()</code> メソッドは産出された値を含む <code>value</code> プロパティと、ジェネレーターが最後の値を持つかを真偽値で示す <code>done</code> プロパティを持つオブジェクトを返します。引数つきで<code>next()</code> を呼び出すと、ジェネレーター関数の実行が再開され、処理が停止していた <code>yield</code> 式を <code>next()</code> の引数で置き換えます。</p>
+
+<p>ジェネレーターで <code>return</code> 文が実行されると、ジェネレーターが終了します (つまり、それによって返されたオブジェクトの <code>done</code> プロパティが <code>true</code> に設定されます)。値が返された場合、それはジェネレーターによって返されたオブジェクトの <code>value</code> プロパティとして設定されます。 <code>return</code> 文とよく似ていますが、ジェネレーターの内部でエラーが発生した場合は、ジェネレーターの本体の中でキャッチしない限り、ジェネレーターは終了します。<br>
+ ジェネレーターが終了すると、それ以降の <code>next()</code> の呼び出しでは、そのジェネレーターのコードは実行されず、 <code>{value: undefined, done: true}</code> の形のオブジェクトが返されるだけです。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Simple_example" name="Simple_example">単純な例</h3>
+
+<pre class="brush: js notranslate">function* idMaker() {
+  var index = 0;
+  while (true)
+    yield index++;
+}
+
+var gen = idMaker();
+
+console.log(gen.next().value); // 0
+console.log(gen.next().value); // 1
+console.log(gen.next().value); // 2
+console.log(gen.next().value); // 3
+// ...</pre>
+
+<h3 id="Example_with_yield*" name="Example_with_yield*">yield* を使用した例</h3>
+
+<pre class="brush: js notranslate">function* anotherGenerator(i) {
+  yield i + 1;
+  yield i + 2;
+  yield i + 3;
+}
+
+function* generator(i) {
+  yield i;
+  yield* anotherGenerator(i);
+  yield i + 10;
+}
+
+var gen = generator(10);
+
+console.log(gen.next().value); // 10
+console.log(gen.next().value); // 11
+console.log(gen.next().value); // 12
+console.log(gen.next().value); // 13
+console.log(gen.next().value); // 20
+</pre>
+
+<h3 id="Passing_arguments_into_Generators" name="Passing_arguments_into_Generators">ジェネレーターに引数を渡す</h3>
+
+<pre class="brush: js notranslate">function* logGenerator() {
+  console.log(0);
+  console.log(1, yield);
+  console.log(2, yield);
+  console.log(3, yield);
+}
+
+var gen = logGenerator();
+
+// 最初の next の呼び出しで、関数の最初から、
+// 最初の yield 文の前まで実行される。
+gen.next();             // 0
+gen.next('pretzel');    // 1 pretzel
+gen.next('california'); // 2 california
+gen.next('mayonnaise'); // 3 mayonnaise
+</pre>
+
+<h3 id="Return_statement_in_a_generator" name="Return_statement_in_a_generator">ジェネレーターにおける return 文</h3>
+
+<pre class="brush: js notranslate">function* yieldAndReturn() {
+  yield "Y";
+  return "R";
+  yield "unreachable";
+}
+
+var gen = yieldAndReturn()
+console.log(gen.next()); // { value: "Y", done: false }
+console.log(gen.next()); // { value: "R", done: true }
+console.log(gen.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="Generator_as_an_object_property" name="Generator_as_an_object_property">オブジェクトプロパティとしてのジェネレーター</h3>
+
+<pre class="brush: js notranslate">const someObj = {
+  *generator () {
+    yield 'a';
+    yield 'b';
+  }
+}
+
+const gen = someObj.generator()
+
+console.log(gen.next()); // { value: 'a', done: false }
+console.log(gen.next()); // { value: 'b', done: false }
+console.log(gen.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="Generator_as_an_object_method" name="Generator_as_an_object_method">オブジェクトメソッドとしてのジェネレーター</h3>
+
+<pre class="brush: js notranslate">class Foo {
+  *generator () {
+    yield 1;
+    yield 2;
+    yield 3;
+  }
+}
+
+const f = new Foo ();
+const gen = f.generator();
+
+console.log(gen.next()); // { value: 1, done: false }
+console.log(gen.next()); // { value: 2, done: false }
+console.log(gen.next()); // { value: 3, done: false }
+console.log(gen.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="Generator_as_a_computed_property" name="Generator_as_a_computed_property">計算プロパティとしてのジェネレーター</h3>
+
+<pre class="brush: js notranslate">class Foo {
+  *[Symbol.iterator] () {
+    yield 1;
+    yield 2;
+  }
+}
+
+const SomeObj = {
+  *[Symbol.iterator] () {
+    yield 'a';
+    yield 'b';
+  }
+}
+
+console.log(Array.from(new Foo)); // [ 1, 2 ]
+console.log(Array.from(SomeObj)); // [ 'a', 'b' ]
+</pre>
+
+<h3 id="Generators_are_not_constructable" name="Generators_are_not_constructable">ジェネレーターはコンストラクターではない</h3>
+
+<pre class="brush: js notranslate">function* f() {}
+var obj = new f; // throws "TypeError: f is not a constructor
+</pre>
+
+<h3 id="Generator_defined_in_an_expression" name="Generator_defined_in_an_expression">式で定義されたジェネレーター</h3>
+
+<pre class="brush: js notranslate">const foo = function* () {
+  yield 10;
+  yield 20;
+};
+
+const bar = foo();
+console.log(bar.next()); // {value: 10, done: false}</pre>
+
+<h3 id="Generator_example" name="Generator_example">ジェネレーターの例</h3>
+
+<pre class="syntaxbox notranslate">function* powers(n){
+     //endless loop to generate
+     for(let current =n;; current *= n){
+         yield current;
+     }
+}
+
+for(let power of powers(2)){
+     //controlling generator
+     if(power &gt; 32) break;
+     console.log(power)
+           //2
+          //4
+         //8
+        //16
+       //32
+}</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-generator-function-definitions', 'function*')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div>
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.generator_function")}}</p>
+</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Operators/function*", "function* 式")}}</li>
+ <li>{{jsxref("GeneratorFunction")}} オブジェクト</li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols">反復プロトコル</a></li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+ <li>{{jsxref("Operators/yield*", "yield*")}}</li>
+ <li>{{jsxref("Function")}} オブジェクト</li>
+ <li>{{jsxref("Statements/function", "function")}} 宣言</li>
+ <li>{{jsxref("Operators/function", "function")}} 式</li>
+ <li>{{jsxref("Functions_and_function_scope", "関数と関数スコープ", "", 1)}}</li>
+ <li>その他のウェブリソース:
+  <ul>
+   <li><a href="http://facebook.github.io/regenerator/">Regenerator</a> an ES2015 generator compiler to ES5</li>
+   <li><a href="http://www.youtube.com/watch?v=qbKWsbJ76-s">Forbes Lindesay: Promises and Generators: control flow utopia -- JSConf EU 2013</a></li>
+   <li><a href="https://github.com/mozilla/task.js">Task.js</a></li>
+   <li><a href="https://github.com/getify/You-Dont-Know-JS/blob/1st-ed/async%20%26%20performance/ch4.md#iterating-generators-asynchronously">Iterating generators asynchronously</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/if...else/index.html b/files/ja/web/javascript/reference/statements/if...else/index.html
new file mode 100644
index 0000000000..ed1acb9d3a
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/if...else/index.html
@@ -0,0 +1,152 @@
+---
+title: if...else
+slug: Web/JavaScript/Reference/Statements/if...else
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - else
+  - if
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/if...else
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><span class="seoSummary"><strong><code>if</code> 文</strong>は、指定された条件が {{Glossary("truthy")}} ならば文を実行します。条件が {{Glossary("falsy")}} なら、もう一方の文を実行することができます。</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-ifelse.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox">if (<var>condition</var>)
+   <var>statement1</var>
+[else
+   <var>statement2</var>]
+</pre>
+
+<dl>
+ <dt><code><var>condition</var></code></dt>
+ <dd>{{Glossary("truthy")}} または {{Glossary("falsy")}} と認識される<a href="/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions">式</a>です。</dd>
+</dl>
+
+<dl>
+ <dt><code><var>statement1</var></code></dt>
+ <dd><var>condition</var> が {{Glossary("truthy")}} なら実行される文です。さらにネストされた <code>if</code> 文を含む、どんな文であってもかまいません。複数の文を実行するためには、それらの文をグループ化するために<a href="/ja/docs/Web/JavaScript/Reference/Statements/block">ブロック</a>文 (<code>{ ... }</code>) を使ってください。実行する文がない場合は、<a href="/ja/docs/Web/JavaScript/Reference/Statements/Empty">空文</a> を使用してください。</dd>
+ <dt><code><var>statement2</var></code></dt>
+ <dd><code><var>condition</var></code> が {{Glossary("falsy")}} で、かつ <code>else</code> 節が存在するなら実行される文です。ブロック文およびさらにネストされた <code>if</code> 文を含む、どんな文であってもかまいません。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>複数の <code>if...else</code> 文をネストすることで、 <code>else if</code> 節を作成することができます。 JavaScript では <code>elseif</code> (1 単語) キーワードがありませんので注意してください。</p>
+
+<pre class="brush: js">if (<var>condition1</var>)
+  <var>statement1</var>
+else if (<var>condition2</var>)
+  <var>statement2</var>
+else if (<var>condition3</var>)
+  <var>statement3</var>
+...
+else
+  <var>statementN</var>
+</pre>
+
+<p>これがどのように動作するか理解するために、ネストが適切にインデントされていたらどのように見えるかを示します。</p>
+
+<pre class="brush: js">if (<var>condition1</var>)
+  <var>statement1</var>
+else
+  if (<var>condition2</var>)
+    <var>statement2</var>
+  else
+    if (<var>condition3</var>)
+...
+</pre>
+
+<p>節の中で複数の文を実行するためには、それらの文をグループ化するためにブロック文 (<code>{ ... }</code>) を使ってください。一般的に、ブロック文を常に使うのはよい習慣です。ネストされた <code>if</code> 文が絡むコードにおいて特にそうです:</p>
+
+<pre class="brush: js">if (<var>condition</var>) {
+  <var>statements1</var>
+} else {
+  <var>statements2</var>
+}
+</pre>
+
+<p>プリミティブな真偽値である <code>true</code> および <code>false</code> を {{jsxref("Global_Objects/Boolean", "Boolean")}} オブジェクトの真偽性と混同しないでください。 <code>false</code>, <code>undefined</code>, <code>null</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, 空文字列 (<code>""</code>) のいずれでもない値、および任意のオブジェクトは (<code>false</code> の値を持つ Boolean オブジェクトを含め)、条件として使用されたときに {{Glossary("truthy")}} と解釈されます。例えば以下のような場合です。</p>
+
+<pre class="brush: js">var b = new Boolean(false);
+if (b) // この条件式は truthy です
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_if...else" name="Using_if...else">if...else の使用</h3>
+
+<pre class="brush: js">if (cipher_char === from_char) {
+  result = result + to_char;
+  x++;
+} else {
+  result = result + clear_char;
+}
+</pre>
+
+<h3 id="Using_else_if" name="Using_else_if">else if の使用</h3>
+
+<p>JavaScript に <code>elseif</code> 構文はありませんので注意してください。 <code>else</code> と <code>if</code> の間に空白を置いて記述します。</p>
+
+<pre class="brush: js">if (x &gt; 50) {
+  /* 何かを行う */
+} else if (x &gt; 5) {
+  /* 何かを行う */
+} else {
+  /* 何かを行う */
+}</pre>
+
+<h3 id="Assignment_within_the_conditional_expression" name="Assignment_within_the_conditional_expression">条件式の中での代入</h3>
+
+<p>代入はコードを眺めたときに等式と混同される可能性があるので、条件式の中で単純な代入を使わないほうが望ましいです。たとえば、次のコードを使わないでください。</p>
+
+<pre class="brush: js example-bad">if (x = y) {
+  /* 何かを行う */
+}
+</pre>
+
+<p>もし条件式の中で代入を使う必要があるのなら、次の例のように、代入の周りに追加の括弧を書くのが一般的な習慣です。</p>
+
+<pre class="brush: js example-good">if ((x = y)) {
+  /* 何かを行う */
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-if-statement', 'if statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.if_else")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/block", "block")}}</li>
+ <li>{{jsxref("Statements/switch", "switch")}}</li>
+ <li><a href="/ja/docs/JavaScript/Reference/Operators/Conditional_Operator">条件演算子</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/import.meta/index.html b/files/ja/web/javascript/reference/statements/import.meta/index.html
new file mode 100644
index 0000000000..b6d12f830a
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/import.meta/index.html
@@ -0,0 +1,101 @@
+---
+title: import.meta
+slug: Web/JavaScript/Reference/Statements/import.meta
+tags:
+  - JavaScript
+  - Language feature
+  - Modules
+  - Reference
+  - Statement
+  - import
+  - import.meta
+translation_of: Web/JavaScript/Reference/Statements/import.meta
+---
+<div>{{JSSidebar("Statements")}}</div>
+
+<p><strong><code>import.meta</code></strong> オブジェクトはコンテキスト固有のメタデータを JavaScript のモジュールに公開します。これには、モジュールの URL のようなモジュールに関する情報が含まれています。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">import.meta</pre>
+
+<h2 id="Description" name="Description">説明</h2>
+
+<p>構文は、<code>import</code> キーワードとドット、プロパティ名の <code>meta</code> で構成されています。通常、ドットの左側はプロパティアクセスが実行されるオブジェクトですが、ここでの <code>import</code> はオブジェクトではありません。</p>
+
+<p><code>import.meta</code> オブジェクトは ECMAScript 実装によって生成され、プロトタイプは {{jsxref("null")}} です。オブジェクトは拡張でき、そのプロパティは書き込み、構成、列挙可能です。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_import.meta" name="Using_import.meta">import.meta を使用する</h3>
+
+<p><code>my-module.mjs</code> モジュールを指定します。</p>
+
+<pre class="brush: html notranslate">&lt;script type="module" src="my-module.js"&gt;&lt;/script&gt;
+</pre>
+
+<p><code>import.meta</code> オブジェクトを使用してモジュールのメタ情報にアクセスできます。</p>
+
+<pre class="brush: js; notranslate">console.log(import.meta); // { url: "file:///home/user/my-module.js" }</pre>
+
+<p>モジュールのベース URL を示す <code>url</code> プロパティを持つオブジェクトを返します。これは、外部スクリプトの場合はスクリプトを取得した URL、インラインスクリプトの場合はそれを含むドキュメントのベース URL です。</p>
+
+<p>これには、クエリパラメータまたはハッシュ（つまり、<code>?</code> または <code>#</code>）が含まれることに注意してください。</p>
+
+<p>例えば、以下のような HTML で</p>
+
+<pre class="brush: html notranslate">&lt;script type="module"&gt;
+import './index.mjs?someURLInfo=5';
+&lt;/script&gt;</pre>
+
+<p>以下の JavaScript ファイルは、<code>someURLInfo</code> パラメータをログに記録します。</p>
+
+<pre class="brush: js notranslate">// index.mjs
+new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
+
+<p>ファイルが別のファイルをインポートする場合も同様です。</p>
+
+<pre class="brush: js notranslate">// index.mjs
+import './index2.mjs?someURLInfo=5';
+
+// index2.mjs
+new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
+
+<p>メモ: 後者の例のように Node.js はクエリパラメータ（またはハッシュ）を渡しますが、Node 14.1.0 以降、クエリパラメータを持つ URL を <code>node --experimental-modules index.mjs?someURLInfo=5</code> という形式で読み込むとエラーになることに注意してください（この文脈では URL ではなくファイルとして扱われます）。</p>
+
+<p>このようなファイル固有の引数の受け渡しは、アプリケーション全体の <code>location.href</code>（HTML ファイルパスの後にクエリ文字列やハッシュを追加したもの [Node.js では <code>process.argv</code> を介して]）で使用されているものを補完する場合があります。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+  <tr>
+   <td><code><a href="https://tc39.es/proposal-import-meta/#prod-ImportMeta">import.meta</a></code> proposal</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "webappapis.html#hostgetimportmetaproperties", "import.meta")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>
+
+
+
+<p>{{Compat("javascript.statements.import_meta")}}</p>
+
+<h3 id="Implementation_Progress" name="Implementation_Progress">実装の進捗状況</h3>
+
+<p>この機能はまだブラウザー間の安定性に達していないため、以下の表で、この機能の毎日の実装状況を示しています。このデータは、JavaScript の標準テストスイートである <a href="https://github.com/tc39/test262">Test262</a> で、ナイトリービルド、または各ブラウザーの JavaScript エンジンの最新リリースで、関連する機能テストを実行することで生成されます。</p>
+
+<div>{{EmbedTest262ReportResultsTable("import.meta")}}</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{JSxRef("Statements/import", "import")}}</li>
+ <li>{{JSxRef("Statements/export", "export")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/import/index.html b/files/ja/web/javascript/reference/statements/import/index.html
new file mode 100644
index 0000000000..f0854708d8
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/import/index.html
@@ -0,0 +1,253 @@
+---
+title: import
+slug: Web/JavaScript/Reference/Statements/import
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Language feature
+  - Modules
+  - Reference
+  - Statement
+  - dynamic import
+  - import
+translation_of: Web/JavaScript/Reference/Statements/import
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><code><strong>import</strong></code> 文は、他のモジュールによって<a href="/ja/docs/Web/JavaScript/Reference/Statements/export">エクスポート</a>された読み込み専用のライブバインディングをインポートするために使用します。インポートされたモジュールは、宣言するかどうかにかかわらず、{{JSxRef("Strict_mode","Strict モード")}}になります。<code>import</code> 文は、スクリプトに <code>type="module"</code> がない限り、埋め込みスクリプトで使用できません。インポートされたバインディングは、バインディングをエクスポートしたモジュールによって更新されるため、ライブバインディングと呼ばれます。</p>
+
+<p>また、<code>type="module"</code> のスクリプトを必要としない動的 <code><strong>import()</strong></code> という関数のようなものもあります。</p>
+
+<p>{{HTMLElement("script")}} タグの <code>nomodule</code> 属性を使用すると、下位互換性を確保できます。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox brush:js notranslate">import <em>defaultExport</em> from "<em>module-name</em>";
+import * as <em>name</em> from "<em>module-name</em>";
+import { <em>export1</em> } from "<em>module-name</em>";
+import { <em>export1</em> as <em>alias1</em> } from "<em>module-name</em>";
+import { <em>export1</em> , <em>export2</em> } from "<em>module-name</em>";
+import { <em>foo</em> , <em>bar</em> } from "<em>module-name/path/to/specific/un-exported/file</em>";
+import { <em>export1</em> , <em>export2</em> as <em>alias2</em> , [...] } from "<em>module-name</em>";
+import <em>defaultExport</em>, { export1 [ , [...] ] } from "<em>module-name</em>";
+import <em>defaultExport</em>, * as <em>name</em> from "<em>module-name</em>";
+import "<em>module-name</em>";
+var promise = import("<em>module-name</em>");
+</pre>
+
+<dl>
+ <dt><code>defaultExport</code></dt>
+ <dd>モジュールからのデフォルトのエクスポートを参照する名前。</dd>
+ <dt><code>module-name</code></dt>
+ <dd>インポートするモジュール。モジュールがある <code>.js</code> ファイルへの相対または絶対パス名です。バンドラーによっては、拡張子を加えることが許され、あるいは求められることがあります。環境を確認してください。シングルクォートとダブルクォートだけが使えます。</dd>
+ <dt><code>name</code></dt>
+ <dd>インポートを参照するとき名前空間のように用いられるモジュールオブジェクトの名前。</dd>
+ <dt><code>exportN</code></dt>
+ <dd>インポートするエクスポートの名前。</dd>
+ <dt><code>aliasN</code></dt>
+ <dd>指定されたインポートを参照する名前。</dd>
+</dl>
+
+<h2 id="Description" name="Description">説明</h2>
+
+<p><code>name</code> パラメータは、エクスポートを参照する名前空間のように用いられる「モジュールオブジェクト」の名前です。<code>export</code> パラメータは名前がつけられたエクスポートをそれぞれ指定します。それに対して、<code>import * as name</code> 構文はすべてをインポートします。構文の意味を明らかにするため、下記に例を示します。</p>
+
+<h3 id="Import_an_entire_modules_contents" name="Import_an_entire_module's_contents">モジュールのコンテンツすべてをインポートする</h3>
+
+<p>下記のコードは、<code>myModule</code> を現在のスコープに加え、<code>/modules/my-module.js</code> のファイルのモジュールからのエクスポートすべてを含めます。</p>
+
+<pre class="brush: js notranslate">import * as <em>myModule</em> from '/modules/my-module.js';
+</pre>
+
+<p>エクスポートにアクセスするには、モジュール名（ここでは「myModule」）を名前空間として用いることになります。たとえば、上記でインポートされたモジュールがエクスポートに <code>doAllTheAmazingThings()</code> を含む場合は、下記のように呼び出します。</p>
+
+<pre class="brush: js notranslate">myModule.doAllTheAmazingThings();</pre>
+
+<h3 id="Import_a_single_export_from_a_module" name="Import_a_single_export_from_a_module">モジュールからエクスポートをひとつインポートする</h3>
+
+<p><code>myExport</code> という名前のオブジェクトまたは値が、<code>my-module</code> から暗黙的 (モジュール全体がエクスポートされた場合) あるいは {{jsxref("Statements/export", "export")}} 文を用いて明示的にエクスポートされると、<code>myExport</code> が現在のスコープに加えられます。</p>
+
+<pre class="brush: js notranslate">import {myExport} from '/modules/my-module.js';</pre>
+
+<h3 id="Import_multiple_exports_from_module" name="Import_multiple_exports_from_module">モジュールから複数のエクスポートをインポートする</h3>
+
+<p>下記のコードは、<code>foo</code> と <code>bar</code> を現在のスコープに加えます。</p>
+
+<pre class="brush: js notranslate">import {foo, bar} from '/modules/my-module.js';</pre>
+
+<h3 id="Import_an_export_with_a_more_convenient_alias" name="Import_an_export_with_a_more_convenient_alias">エクスポートを扱いやすいエイリアスにしてインポートする</h3>
+
+<p>インポートするときエクスポートの名前を変えることができます。例えば下記のコードは、エクスポートを <code>shortName</code> として現在のスコープに加えます。</p>
+
+<pre class="brush: js notranslate">import {reallyReallyLongModuleExportName as shortName}
+  from '/modules/my-module.js';</pre>
+
+<h3 id="Rename_multiple_exports_during_import" name="Rename_multiple_exports_during_import">インポートする際に複数のエクスポートの名前を変える</h3>
+
+<p>下記のコードは、複数のエクスポートを扱いやすいエイリアスにしてモジュールからインポートします。</p>
+
+<pre class="brush: js notranslate">import {
+  reallyReallyLongModuleExportName as shortName,
+  anotherLongModuleName as short
+} from '/modules/my-module.js';</pre>
+
+<h3 id="Import_a_module_for_its_side_effects_only" name="Import_a_module_for_its_side_effects_only">副作用のためだけにモジュールをインポートする</h3>
+
+<p>副作用だけのためにモジュール全体をインポートしたときは、何もインポートされません。モジュールのグローバルコードが実行されるだけで、実際の値はインポートされないのです。</p>
+
+<pre class="brush: js notranslate">import '/modules/my-module.js';
+</pre>
+
+<p>これは{{anch("Dynamic Imports", "動的インポート")}}にも対応しています。</p>
+
+<pre class="brush: js notranslate">(async () =&gt; {
+  if (somethingIsTrue) {
+    // 副作用のためのインポートモジュール
+    await import('/modules/my-module.js');
+  }
+})();</pre>
+
+<p>If your project uses packages that export ESM, you can also import them for side effects only. This will run the code in the package entry point file (and any files it imports) only. </p>
+
+
+<h3 id="Importing_defaults" name="Importing_defaults">デフォルトをインポートする</h3>
+
+<p>デフォルトの {{jsxref("Statements/export", "export")}}（オブジェクト、関数、クラスなど）にも対応できます。<code>import</code> 文を用いて、そのようなデフォルトをインポートします。</p>
+
+<p>もっとも単純なやり方は、デフォルトを直接インポートすることです。</p>
+
+<pre class="brush: js notranslate">import myDefault from '/modules/my-module.js';</pre>
+
+<p>また、デフォルトの構文とともに上記のエイリアス（名前空間または名前つきのインポート）を用いることもできます。その場合は下記のように、デフォルトのインポートを先に宣言しなければなりません。</p>
+
+<pre class="brush: js notranslate">import myDefault, * as myModule from '/modules/my-module.js';
+// myModule は名前空間として使う</pre>
+
+<p>あるいは、次のような書き方もできます。</p>
+
+<pre class="brush: js notranslate">import myDefault, {foo, bar} from '/modules/my-module.js';
+// 特定の名前つきのインポート
+</pre>
+
+<p>{{anch("Dynamic Imports", "動的インポート")}}を使用してデフォルトのエクスポートをインポートする場合、動作が少し異なります。返されたオブジェクトから "default" キーを破棄して名前を変更する必要があります。</p>
+
+<pre class="brush: js notranslate">(async () =&gt; {
+  if (somethingIsTrue) {
+    const { default: myDefault, foo, bar } = await import('/modules/my-module.js');
+  }
+})();</pre>
+
+<h3 id="Dynamic_Imports" name="Dynamic_Imports">動的インポート</h3>
+
+<p>標準のインポート構文は静的で、インポートされたモジュールのすべてのコードは、ロード時に常に評価されます。条件付きまたはオンデマンドでモジュールをロードしたい状況では、代わりに動的インポートを使用できます。以下に、動的インポートの使用を検討する必要がある理由をいくつか述べます。</p>
+
+<ul>
+ <li>静的にインポートすると、コードの読み込みが大幅に遅くなり、インポートするコードが必要になる可能性が低くなるか、後で必要になる可能性が低くなります。</li>
+ <li>静的にインポートすると、プログラムのメモリー使用量が大幅に増加し、インポートするコードが必要になる可能性が低くなります。</li>
+ <li>ロード時にインポートするモジュールが存在しない場合。</li>
+ <li>インポート指定子の文字列を動的に作成する必要がある場合。（静的インポートは静的指定子のみをサポートします。）</li>
+ <li>インポートするモジュールに副作用があり、何らかの条件が真でない限り、それらの副作用を望まない場合。（モジュールに副作用がないことを推奨しますが、モジュールの依存関係でこれを制御できない場合があります。）</li>
+</ul>
+
+<p>動的インポートは必要な場合にのみ使用してください。初期の依存関係をロードするには静的な形式が適していて、静的解析ツールや<a href="/ja/docs/Glossary/Tree_shaking">ツリーシェイク</a>の恩恵をよりよく受けることができます。</p>
+
+<p>モジュールを動的にインポートするために、<code>import</code> キーワードを関数として呼び出すことができます。この方法で使用すると、promise が返されます。</p>
+
+<pre class="brush: js notranslate">import('/modules/my-module.js')
+  .then((module) =&gt; {
+    // module を使った何らかの処理
+  });
+</pre>
+
+<p>この方法は <code>await</code> キーワードを使えます。</p>
+
+<pre class="brush: js notranslate">let module = await import('/modules/my-module.js');</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Standard_Import" name="Standard_Import">標準的なインポート</h3>
+
+<p>以下のコードは AJAX JSON リクエストの処理を支援する補助モジュールからインポートする方法を示しています。</p>
+
+<h4 id="The_module_file.js" name="The_module_file.js">モジュール: file.js</h4>
+
+<pre class="brush: js notranslate">function getJSON(url, callback) {
+  let xhr = new XMLHttpRequest();
+  xhr.onload = function () {
+    callback(this.responseText)
+  };
+  xhr.open('GET', url, true);
+  xhr.send();
+}
+
+export function getUsefulContents(url, callback) {
+  getJSON(url, data =&gt; callback(JSON.parse(data)));
+}</pre>
+
+<h4 id="The_main_program_main.js" name="The_main_program_main.js">メインプログラム: main.js</h4>
+
+<pre class="brush: js notranslate">import { getUsefulContents } from '/modules/file.js';
+
+getUsefulContents('http://www.example.com',
+    data =&gt; { doSomethingUseful(data); });</pre>
+
+<h3 id="Dynamic_Import" name="Dynamic_Import">動的インポート</h3>
+
+<p>この例は、ユーザーのアクション（この場合はボタンクリック）に基づいて機能をページにロードし、そのモジュール内で関数を呼び出す方法を示しています。この機能を実装する方法はこれだけではありません。<code>import()</code> 関数は <code>await</code> もサポートしています。</p>
+
+<pre class="brush: js notranslate">const main = document.querySelector("main");
+for (const link of document.querySelectorAll("nav &gt; a")) {
+  link.addEventListener("click", e =&gt; {
+    e.preventDefault();
+
+    import('/modules/my-module.js')
+      .then(module =&gt; {
+        module.loadPageInto(main);
+      })
+      .catch(err =&gt; {
+        main.textContent = err.message;
+      });
+  });
+}</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("ESDraft", "#sec-imports", "Imports")}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("ESDraft", "#sec-import-calls", "Import Calls")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>
+
+
+
+<p>{{Compat("javascript.statements.import")}}</p>
+
+<h3 id="Implementation_Progress" name="Implementation_Progress">実装の進捗状況</h3>
+
+<p>この機能はまだブラウザー間の安定性に達していないため、以下の表で、この機能の毎日の実装状況を示しています。このデータは、JavaScript の標準テストスイートである <a href="https://github.com/tc39/test262">Test262</a> で、ナイトリービルド、または各ブラウザーの JavaScript エンジンの最新リリースで、関連する機能テストを実行することで生成されます。</p>
+
+<div>{{EmbedTest262ReportResultsTable("dynamic-import")}}</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{JSxRef("Statements/export", "export")}}</li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Statements/import.meta"><code>import.meta</code></a></li>
+ <li>Limin Zhu, Brian Terlson and Microsoft Edge Team: <a href="https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond/">Previewing ES6 Modules and more from ES2015, ES2016 and beyond</a></li>
+ <li>Hacks blog post by Jason Orendorff: <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a></li>
+ <li>Hacks blog post by Lin Clark: <a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">ES modules: A cartoon deep-dive</a></li>
+ <li>Axel Rauschmayer's book: <a class="external" href="http://exploringjs.com/es6/ch_modules.html">"Exploring JS: Modules"</a></li>
+ <li>The Modern JavaScript Tutorial(javascript.info): <a class="external" href="https://javascript.info/import-export">Export and Import</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/index.html b/files/ja/web/javascript/reference/statements/index.html
new file mode 100644
index 0000000000..c7540c45a3
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/index.html
@@ -0,0 +1,130 @@
+---
+title: 文と宣言
+slug: Web/JavaScript/Reference/Statements
+tags:
+  - JavaScript
+  - Landing page
+  - Reference
+  - statements
+translation_of: Web/JavaScript/Reference/Statements
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>JavaScript アプリケーションは、適切な構文で書かれた文から構成されます。ひとつの文が数行に渡る場合もあります。また複数の文それぞれがセミコロンで区切られていれば 1 行となる場合もあります。そのキーワードはひとつではなく、キーワードのグループとなっています。</p>
+
+<h2 id="Statements_and_declarations_by_category" name="Statements_and_declarations_by_category">文と宣言（カテゴリ別）</h2>
+
+<p>アルファベット順リストは左サイドバーで確認できます。</p>
+
+<h3 id="Control_flow" name="Control_flow">フロー制御</h3>
+
+<dl>
+ <dt>{{jsxref("Statements/block", "ブロック","",1)}}</dt>
+ <dd>ブロック文は 0 個以上の文をグループ化するのに使います。ブロックは 1 組の波括弧で囲みます。</dd>
+ <dt>{{jsxref("Statements/break", "break")}}</dt>
+ <dd>現在実行中のループ、<code>switch</code> による分岐、あるいはラベル文を終了し、その終了した文に続く文へとプログラムの制御を移行します。</dd>
+ <dt>{{jsxref("Statements/continue", "continue")}}</dt>
+ <dd>現在実行中のループ、またはラベル付きループで現在反復している文の実行を終了し、そのループの実行を次の反復から継続します。</dd>
+ <dt>{{jsxref("Statements/Empty", "空文","",1)}}</dt>
+ <dd>空文は、文が必要ないが JavaScript の文法上 1 つの文が必要な場合に使います。 </dd>
+ <dt>{{jsxref("Statements/if...else", "if...else")}}</dt>
+ <dd>与えられた条件が真の場合はある文を実行します。条件が偽の場合はまた別の文を実行できます。</dd>
+ <dt>{{jsxref("Statements/switch", "switch")}}</dt>
+ <dd>ある式を評価し、式の値を case 節と照らし合わせ、 case 節に関連付けられた文を実行します。</dd>
+ <dt>{{jsxref("Statements/throw", "throw")}}</dt>
+ <dd>ユーザー定義の例外を発生させます。</dd>
+ <dt>{{jsxref("Statements/try...catch", "try...catch")}}</dt>
+ <dd>実行を試み、例外が発生した際に行うべき処理を規定する文のブロックを記述します。</dd>
+</dl>
+
+<h3 id="Declarations" name="Declarations">宣言</h3>
+
+<dl>
+ <dt>{{jsxref("Statements/var", "var")}}</dt>
+ <dd>変数を宣言し、その変数をある値に初期化することもできます。</dd>
+ <dt>{{jsxref("Statements/let", "let")}}</dt>
+ <dd>ブロックスコープを持つ局所変数を宣言し、その変数をある値に初期化することもできます。</dd>
+ <dt>{{jsxref("Statements/const", "const")}}</dt>
+ <dd>読み取り専用の名前付き定数を宣言します。</dd>
+</dl>
+
+<h3 id="Functions_and_classes" name="Functions_and_classes">関数とクラス</h3>
+
+<dl>
+ <dt>{{jsxref("Statements/function", "function")}}</dt>
+ <dd>特定の仮引数を持つ関数を宣言します。</dd>
+ <dt>{{jsxref("Statements/function*", "function*")}}</dt>
+ <dd><a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols">イテレーター</a>をより簡単に書けるジェネレーター関数です。</dd>
+ <dt>{{jsxref("Statements/async_function", "async function")}}</dt>
+ <dd>指定したパラメーターの非同期関数を定義します。</dd>
+ <dt>{{jsxref("Statements/return", "return")}}</dt>
+ <dd>関数によって返される値を指定します。</dd>
+ <dt>{{jsxref("Statements/class", "class")}}</dt>
+ <dd>クラスを宣言します。</dd>
+</dl>
+
+<h3 id="Iterations" name="Iterations">反復処理</h3>
+
+<dl>
+ <dt>{{jsxref("Statements/do...while", "do...while")}}</dt>
+ <dd>テスト条件が偽と評価されるまで指定された文を実行するループを作成します。この条件は文が実行されたあとに評価され、その結果少なくとも 1 回は指定された文が実行されます。</dd>
+ <dt>{{jsxref("Statements/for", "for")}}</dt>
+ <dd>丸括弧で囲まれ、セミコロンで区切られた 3 つの式と、それに続くループ内で実行される文から構成されるループを作成します。</dd>
+ <dt>{{jsxref("Statements/for_each...in", "for each...in")}}</dt>
+ <dd>オブジェクトプロパティのすべての値を、指定した変数を通して反復処理を行います。それぞれ個別のプロパティに対し、指定した文が実行されます。</dd>
+ <dt>{{jsxref("Statements/for...in", "for...in")}}</dt>
+ <dd>オブジェクトの列挙可能なプロパティに対し任意の順番で反復処理を行います。それぞれ個別のプロパティに対し、文を実行できます。</dd>
+ <dt>{{jsxref("Statements/for...of", "for...of")}}</dt>
+ <dd>反復可能オブジェクト ({{jsxref("Global_Objects/Array","配列","","true")}}、配列風オブジェクト、<a href="/ja/docs/Web/JavaScript/Guide/Iterators_and_Generators">イテレーターとジェネレーター</a>を含む) を反復処理し、それぞれ個別のプロパティの値に対する実行文をともなった反復処理フックを呼び出します。</dd>
+ <dt>{{jsxref("Statements/for-await...of", "for await...of")}}</dt>
+ <dd>非同期反復オブジェクト、配列風オブジェクト、<a href="/ja/docs/JavaScript/Guide/Iterators_and_Generators">イテレーターとジェネレーター</a>を反復処理し、各固有のプロパティ値で実行する文を実行しつつ、カスタムイテレーションフックを実行する。</dd>
+ <dt>{{jsxref("Statements/while", "while")}}</dt>
+ <dd>テスト条件が真と評価される間、指定した文を実行するループを作成します。この条件は文が実行される前に評価されます。</dd>
+</dl>
+
+<h3 id="Others" name="Others">その他</h3>
+
+<dl>
+ <dt>{{jsxref("Statements/debugger", "debugger")}}</dt>
+ <dd>利用可能なデバッグ機能を呼び出します。利用可能なデバッグ機能がない場合、この文は無効となります。</dd>
+ <dt>{{jsxref("Statements/export", "export")}}</dt>
+ <dd>外部モジュールや別のスクリプトでインポートできるように、関数をエクスポートするのに使われます。</dd>
+ <dt>{{jsxref("Statements/import", "import")}}</dt>
+ <dd>外部モジュールや別のスクリプトからエクスポートされる関数をインポートするのに使われます。</dd>
+ <dt><a href="/ja/docs/Web/JavaScript/Reference/Statements/import.meta"><code>import.meta</code></a></dt>
+ <dd>JavaScript モジュールのコンテンツ固有なメタデータを公開するオブジェクト。</dd>
+ <dt>{{jsxref("Statements/label", "label", "", 1)}}</dt>
+ <dd><code>break</code> や <code>continue</code> 文を使う際に参照できる識別子を含む文を用意します。</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Statements/with", "with")}} </dt>
+ <dd>文のスコープチェーンを拡張します。</dd>
+</dl>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Operators">演算子</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/label/index.html b/files/ja/web/javascript/reference/statements/label/index.html
new file mode 100644
index 0000000000..12deae6ffd
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/label/index.html
@@ -0,0 +1,188 @@
+---
+title: label
+slug: Web/JavaScript/Reference/Statements/label
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/label
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>ラベル付き文</strong>は、 {{jsxref("Statements/break", "break")}} 文や {{jsxref("Statements/continue", "continue")}} 文と組み合わせて使用することができます。これは文に参照先となる識別子の接頭辞をつけます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-label.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<div class="note">
+<p><strong>注:</strong> ループやブロックに名前を付けることはめったにありません。ふつうは、ジャンプによるループの代わりに関数呼び出しを使用することができます。</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate"><em>ラベル</em> :
+  <em>文</em>
+</pre>
+
+<dl>
+ <dt><code><em>ラベル</em></code></dt>
+ <dd>予約語ではない任意の JavaScript の識別子。</dd>
+ <dt><code><em>文</em></code></dt>
+ <dd>文。 <code>break</code> は任意のラベル付き文で使うことができ、 <code>continue</code> はループのラベル付き文で使うことができます。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>ループを識別するためにラベルを使い、そして、プログラムがループを中断すべきか、またはその実行を継続すべきかを指し示すために、<code>break</code> または <code>continue</code> 文を使うことができます。</p>
+
+<p>JavaScript には <strong><code>goto</code> 文がなく</strong>、ラベルと <code>break</code> または <code>continue</code> のみ使用できます。</p>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a>のコードでは、 "<code>let</code>" をラベル名として使用することができません。この場合、 {{jsxref("SyntaxError")}} が発生します (let は予約語です)。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_a_labeled_continue_with_for_loops" name="Using_a_labeled_continue_with_for_loops">ラベル付き continue を for ループで使用する</h3>
+
+<pre class="brush: js notranslate">var i, j;
+
+loop1:
+for (i = 0; i &lt; 3; i++) {      // 1 番目の for 文に "loop1" というラベルをつける
+   loop2:
+   for (j = 0; j &lt; 3; j++) {   // 2 番目の 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="Using_a_labeled_continue_statement" name="Using_a_labeled_continue_statement">ラベル付き continue 文を使用する</h3>
+
+<p>配列 items と tests について、このサンプルはすべてを tests に渡した items の数を数えます。</p>
+
+<pre class="brush: js notranslate">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="Using_a_labeled_break_with_for_loops" name="Using_a_labeled_break_with_for_loops">for ループでラベル付き break を使用する</h3>
+
+<pre class="brush: js notranslate">var i, j;
+
+loop1:
+for (i = 0; i &lt; 3; i++) {      // 1 番目の for 文に "loop1" というラベルをつける
+   loop2:
+   for (j = 0; j &lt; 3; j++) {   // 2 番目の for 文に "loop2" というラベルをつける
+      if (i === 1 &amp;&amp; j === 1) {
+         break loop1;
+      }
+      console.log('i = ' + i + ', j = ' + j);
+   }
+}
+
+// 結果:
+//   "i = 0, j = 0"
+//   "i = 0, j = 1"
+//   "i = 0, j = 2"
+//   "i = 1, j = 0"
+// continue の例との違いに注目</pre>
+
+<h3 id="Using_a_labeled_break_statement" name="Using_a_labeled_break_statement">ラベル付き break 文を使用する</h3>
+
+<p>配列 items と tests について、このサンプルは items のすべてを tests に渡したかを判断します。</p>
+
+<pre class="brush: js notranslate">var allPass = true;
+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])) {
+      allPass = false;
+      break top;
+    }
+  }
+}</pre>
+
+<h3 id="Using_a_labeled_block_with_break" name="Using_a_labeled_block_with_break">break を使用したラベル付きブロックの使用</h3>
+
+<p>ラベルを単純なブロックの中でも使用することができますが、ループ以外のラベルでは break 文のみが意味を持ちます。</p>
+
+<pre class="brush: js notranslate">foo: {
+  console.log('face');
+  break foo;
+  console.log('this will not be executed');
+}
+console.log('swap');
+
+// this will log:
+
+// "face"
+// "swap" </pre>
+
+<h3 id="Labeled_function_declarations" name="Labeled_function_declarations">ラベル付き関数宣言</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> において、厳格モード以外のコードで標準化されました。</p>
+
+<pre class="brush: js notranslate">L: function F() {}</pre>
+
+<p>ただし、<a href="/ja/docs/Web/JavaScript/Reference/Strict_mode">厳格モード</a>のコードでは {{jsxref("SyntaxError")}} が発生します。</p>
+
+<pre class="brush: js notranslate">'use strict';
+L: function F() {}
+// SyntaxError: functions cannot be labelled</pre>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Statements/function*">ジェネレーター関数</a>は、厳格モードであってもなくてもラベル付けすることはできません。</p>
+
+<pre class="brush: js notranslate">L: function* F() {}
+// SyntaxError: generator functions cannot be labelled
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-labelled-statements', 'Labelled statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.label")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/break", "break")}}</li>
+ <li>{{jsxref("Statements/continue", "continue")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/let/index.html b/files/ja/web/javascript/reference/statements/let/index.html
new file mode 100644
index 0000000000..a3d9631dd6
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/let/index.html
@@ -0,0 +1,280 @@
+---
+title: let
+slug: Web/JavaScript/Reference/Statements/let
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Language feature
+  - Statement
+  - Variable declaration
+  - Variables
+  - let
+  - 変数
+  - 変数宣言
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/let
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>let</code></strong> 文はブロックスコープのローカル変数を宣言します。任意で値を代入して初期化できます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-let.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">let <var>var1</var> [= <var>value1</var>] [, <var>var2</var> [= <var>value2</var>]] [, ..., <var>varN</var> [= <var>valueN</var>];</pre>
+
+<h3 id="Parameters" name="Parameters">引数</h3>
+
+<dl>
+ <dt><code><var>var1</var></code>, <code><var>var2</var></code>, …, <code><var>varN</var></code></dt>
+ <dd>宣言する変数または複数の変数の名前です。それぞれは JavaScript の正式な識別子である必要があります。</dd>
+ <dt><code><var>value1</var></code>, <code><var>value2</var></code>, …, <code><var>valueN</var></code> {{optional_inline}}</dt>
+ <dd>宣言される変数ごとに、任意で初期値を JavaScript の正式な式で指定することができます。</dd>
+</dl>
+
+<p><a href="/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">分割代入</a>構文は、変数の宣言にも使用できます。</p>
+
+<pre class="syntaxbox notranslate">let <var>{ bar }</var> = <em>foo</em>; // where foo = { bar:10, baz:12 };
+/* これは、値が 10 の 'bar' という名前の変数を作成します。*/</pre>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><strong><code>let</code></strong> を使用することで、それが使用された{{jsxref("statements/block", "ブロック", "", 1)}}、文または式にスコープを限定した変数を宣言することができます。これは {{jsxref("statements/var", "var")}} キーワードのように、変数をブロックスコープに関係なく、グローバルや関数全体のローカルに定義するようなことはありません。他にも、{{jsxref("statements/var", "var")}} と <code>let</code> は、後者は<a href="#Temporal_dead_zone">パーサーが評価したときのみ</a>値の初期化が行われる点が異なります。(下記参照)</p>
+
+<p>{{jsxref("statements/const", "const", "Description")}} と同様に、<code>let</code> はグローバル (一番上のスコープ) で宣言されたときに {{domxref("window")}} オブジェクトのプロパティを生成<em>しません</em>。</p>
+
+<p>なぜ "<strong>let</strong>" という名前が選ばれたのかについては、<a href="https://stackoverflow.com/questions/37916940/why-was-the-name-let-chosen-for-block-scoped-variable-declarations-in-javascri">こちら</a> で解説されています。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Scoping_rules_2" name="Scoping_rules_2">スコープのルール</h3>
+
+<p><strong><code>let</code></strong> で定義された変数は、自身が定義されたブロックと、そこに含まれるサブブロックがスコープになります。この点において <strong><code>let</code></strong> のふるまいは <strong><code>var</code></strong> にとてもよく似ています。大きな違いは、<strong><code>var</code></strong> で定義された変数のスコープはそれを含んでいる関数全体になるということです。</p>
+
+<pre class="brush:js notranslate">function varTest() {
+  var x = 1;
+  {
+    var x = 2;  // 同じ変数です!
+    console.log(x);  // 2
+  }
+  console.log(x);  // 2
+}
+
+function letTest() {
+  let x = 1;
+  {
+    let x = 2;  // 異なる変数
+    console.log(x);  // 2
+  }
+  console.log(x);  // 1
+}
+</pre>
+
+<p id="Scoping_rules">プログラムや関数の最上位においては、<strong><code>let</code></strong> は <strong><code>var</code></strong> とは異なり、グローバルオブジェクト上にプロパティを生成しません。</p>
+
+<pre class="brush:js notranslate">var x = 'global';
+let y = 'global';
+console.log(this.x); // "global"
+console.log(this.y); // undefined
+</pre>
+
+<h3 id="Emulating_private_members" name="Emulating_private_members">プライベートメンバーの模倣</h3>
+
+<p>{{Glossary("Constructor", "コンストラクター")}}の処理の中で <strong><code>let</code></strong> を使用すれば、<a href="/ja/docs/Web/JavaScript/Closures">クロージャ</a>を使用することなくプライベートメンバーを結び付けることができます。</p>
+
+<pre class="brush:js notranslate">var Thing;
+
+{
+  let privateScope = new WeakMap();
+  let counter = 0;
+
+  Thing = function() {
+    this.someProperty = 'foo';
+
+    privateScope.set(this, {
+      hidden: ++counter,
+    });
+  };
+
+  Thing.prototype.showPublic = function() {
+    return this.someProperty;
+  };
+
+  Thing.prototype.showPrivate = function() {
+    return privateScope.get(this).hidden;
+  };
+}
+
+console.log(typeof privateScope);
+// "undefined"
+
+var thing = new Thing();
+
+console.log(thing);
+// Thing {someProperty: "foo"}
+
+thing.showPublic();
+// "foo"
+
+thing.showPrivate();
+// 1
+</pre>
+
+<p>ローカル変数をクロージャで閉じた場合と同様に、<code>var</code> を使ってプライバシーパターンを作成できますが、上の例のようなブロックスコープではなく、関数スコープ（通常はモジュールパターンの IIFE）が必要です。</p>
+
+<h3 id="Redeclarations" name="Redeclarations">再宣言</h3>
+
+<p>同じ関数やブロックのスコープ内で同じ変数を再宣言すると {{jsxref("SyntaxError")}} が発生します。</p>
+
+<pre class="brush: js example-bad notranslate">if (x) {
+  let foo;
+  let foo; // SyntaxError が発生します。
+}
+</pre>
+
+<p>{{jsxref("Statements/switch", "switch")}} 文には 1 つのブロックしかないため、エラーを発生させてしまうかもしれません。</p>
+
+<pre class="brush: js example-bad notranslate">let x = 1;
+switch(x) {
+  case 0:
+    let foo;
+    break;
+
+  case 1:
+    let foo; // 再宣言のため TypeError
+    break;
+}</pre>
+
+<p>ただし、指摘しておくべき重要な点として、case 節の中で入れ子にしたブロックを使えば、新しいブロックスコープの字句環境を作ることができるため、上記のような再宣言エラーが発生しなくなります。</p>
+
+<pre class="brush: js notranslate">let x = 1;
+
+switch(x) {
+  case 0: {
+    let foo;
+    break;
+  }
+  case 1: {
+    let foo;
+    break;
+  }
+}</pre>
+
+<h3 id="Temporal_dead_zone" name="Temporal_dead_zone">一時的なデッドゾーン</h3>
+
+<p>{{jsxref("Statements/var", "var", "var_hoisting")}} で宣言された変数が <code>undefined</code> の値で始まるのとは異なり、<code>let</code> の変数は定義が評価されるまで初期化されません。変数を宣言より前で参照すると {{jsxref("ReferenceError")}} が発生します。変数はブロックの先頭から初期化が行われるまで、「一時的なデッドゾーン」にあるのです。</p>
+
+<pre class="brush: js example-bad notranslate">function do_something() {
+  console.log(bar); // undefined
+  console.log(foo); // ReferenceError
+  var bar = 1;
+  let foo = 2;
+}</pre>
+
+<h3 id="The_temporal_dead_zone_and_typeof" name="The_temporal_dead_zone_and_typeof">一時的なデッドゾーンと <code>typeof</code></h3>
+
+<p>単純に宣言されていない変数や <code>undefined</code> の値を持つ変数とは異なり、<code>typeof</code> 演算子を使用して一時的なデッドゾーン内の変数の型を確認するしようとすると、{{jsxref("ReferenceError")}} が発生します。</p>
+
+<pre class="brush: js example-bad notranslate">// 'undefined' を表示
+console.log(typeof undeclaredVariable);
+
+// 'ReferenceError' が発生します
+console.log(typeof i);
+let i = 10;</pre>
+
+<h3 id="Another_example_of_temporal_dead_zone_combined_with_lexical_scoping" name="Another_example_of_temporal_dead_zone_combined_with_lexical_scoping">一時的なデッドゾーンとレキシカルスコープと組み合わせた例</h3>
+
+<p>字句スコープのため、式 <code>(foo + 55)</code> の中にある識別子 <code>foo</code> は <code>if</code> ブロックの <code>foo</code> と評価され、その上にある変数 <code>foo</code> (<code>33</code> の値を持つ) とは評価されません。</p>
+
+<p>同じ行では、<code>if</code> ブロックの <code>foo</code> が字句環境よりすでに生成されていますが、初期化に達していない (完了していない) 状態です (その分自身の一部であるため)。</p>
+
+<p>このブロックの <code>foo</code> は一時的なデッドゾーンの中にあります。</p>
+
+<pre class="brush: js example-bad notranslate">function test(){
+   var foo = 33;
+   if(foo) {
+      let foo = (foo + 55); // ReferenceError
+   }
+}
+test();</pre>
+
+<p>この現象は、以下のような状況で混乱を催すかもしれません。<code>let n of n.a</code> という命令は、すでに for ループブロックの私的スコープの中になります。そのため、識別子 <code>n.a</code> は命令自身 (<code>let n</code>) の最初の部分にある '<code>n</code>' オブジェクトのプロパティ '<code>a</code>' として解決されます。</p>
+
+<p>その宣言文にはまだ到達・完了していないため、まだ一時的なデッドゾーン内にあるとみなされます。</p>
+
+<pre class="brush: js example-bad notranslate">function go(n) {
+  // n here is defined!
+  console.log(n); // Object {a: [1,2,3]}
+
+  for (let n of n.a) { // ReferenceError
+    console.log(n);
+  }
+}
+
+go({a: [1, 2, 3]});
+</pre>
+
+<h3 id="Other_situations" name="Other_situations">そのほかの場面</h3>
+
+<p>ブロックの中で使えば、<strong><code>let</code></strong> の変数のスコープはそのブロックの中に制限されます。スコープが自身の宣言された関数全体になる <code><strong>var</strong></code> との違いに注意してください。</p>
+
+<pre class="brush: js notranslate">var a = 1;
+var b = 2;
+
+if (a === 1) {
+  var a = 11; // スコープはグローバル
+  let b = 22; // スコープは if ブロック内
+
+  console.log(a);  // 11
+  console.log(b);  // 22
+}
+
+console.log(a); // 11
+console.log(b); // 2
+</pre>
+
+<p>しかし、下記の <strong><code>var</code></strong> と <strong><code>let</code></strong> 宣言の組み合わせは、<strong><code>var</code></strong> がブロックの先頭に配置されているため、{{jsxref("SyntaxError")}} になります。これによって、変数が暗黙的に再宣言されるからです。</p>
+
+<pre class="brush: js example-bad notranslate">let x = 1;
+
+{
+  var x = 2; // 再宣言のため SyntaxError
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、<a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.let")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/var", "var")}}</li>
+ <li>{{jsxref("Statements/const", "const")}}</li>
+ <li><a href="https://hacks.mozilla.org/2015/07/es6-in-depth-let-and-const/">ES6 In Depth: <code>let</code> and <code>const</code></a></li>
+ <li><a href="https://blog.mozilla.org/addons/2015/10/14/breaking-changes-let-const-firefox-nightly-44/">Breaking changes in <code>let</code> and <code>const</code> in Firefox 44</a></li>
+ <li><a href="https://github.com/getify/You-Dont-Know-JS/blob/1st-ed/scope%20%26%20closures/ch3.md">You Don't Know JS: Scope &amp; Closures: Chapter 3: Function vs. Block Scope</a></li>
+ <li><a href="https://stackoverflow.com/a/33198850/1125029">StackOverflow: What is the Temporal Dead Zone</a>?</li>
+ <li><a href="https://stackoverflow.com/questions/762011/whats-the-difference-between-using-let-and-var-to-declare-a-variable">StackOverflow: What is the difference between using <code>let</code> and <code>var</code>?</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/return/index.html b/files/ja/web/javascript/reference/statements/return/index.html
new file mode 100644
index 0000000000..528e48a118
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/return/index.html
@@ -0,0 +1,143 @@
+---
+title: return
+slug: Web/JavaScript/Reference/Statements/return
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/return
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>return</code> 文</strong>は、関数の実行を終了して、関数の呼び出し元に返す値を指定します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-return.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">return [<var>expression</var>]; </pre>
+
+<dl>
+ <dt><code><var>expression</var></code></dt>
+ <dd>返す式。もし省略されたなら、<code>undefined</code> が代わりに返ります。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>関数内で <code>return</code> 文を呼び出すと、関数の実行が停止します。値が指定されていれば、その値を関数の呼び出し元に返します。例えば、以下の関数は引数 <code>x</code> が数値の場合、 <code>x</code> の平方を返します。</p>
+
+<pre class="brush: js notranslate">function square(x) {
+   return x * x;
+}
+var demo = square(3);
+// demo will equal 9
+</pre>
+
+<p>値が省略された場合は <code>undefined</code> が代わりに返されます。</p>
+
+<p>以下の return 文はすべて、関数の実行を中断します。</p>
+
+<pre class="brush: js notranslate">return;
+return true;
+return false;
+return x;
+return x + y / 3;
+</pre>
+
+<h3 id="Automatic_Semicolon_Insertion" name="Automatic_Semicolon_Insertion">自動セミコロン挿入</h3>
+
+<p><code>return</code> 文は<a href="/ja/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion">自動セミコロン挿入 (ASI)</a> の影響を受けます。<code>return</code> キーワードと式の間に改行文字を置くことはできません。</p>
+
+<pre class="brush: js notranslate">return
+a + b;
+</pre>
+
+<p>は ASI によって以下のように変換されます。</p>
+
+<pre class="brush: js notranslate">return;
+a + b;
+</pre>
+
+<p>コンソールに "unreachable code after return statement" という警告が現れます。</p>
+
+<div class="note">Firefox 40 以降では、 <code>return</code> 文の後に到達できないコードがある場合に、コンソールに警告が表示されます。</div>
+
+<p>括弧を使用すると、この問題を防ぐ (ASI を抑止する) ことができます。</p>
+
+<pre class="brush: js notranslate">return (
+  a + b
+);
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Interrupt_a_function" name="Interrupt_a_function">関数を中断する</h3>
+
+<p><code>return</code> を呼び出した時点で、関数の実行が即座に終了します。</p>
+
+<pre class="brush: js notranslate">function counter() {
+  for (var count = 1; ; count++) {  // 無限ループ
+    console.log(count + 'A'); // 5 まで
+      if (count === 5) {
+        return;
+      }
+      console.log(count + 'B');  // 4 まで
+    }
+  console.log(count + 'C');  // 現れない
+}
+
+counter();
+
+// 出力:
+// 1A
+// 1B
+// 2A
+// 2B
+// 3A
+// 3B
+// 4A
+// 4B
+// 5A
+</pre>
+
+<h3 id="Returning_a_function" name="Returning_a_function">関数を返す</h3>
+
+<p><a href="/ja/docs/Web/JavaScript/Closures">クロージャ</a>の記事もご覧ください。</p>
+
+<pre class="brush: js notranslate">function magic() {
+  return function calc(x) { return x * 42; };
+}
+
+var answer = magic();
+answer(1337); // 56154
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-return-statement', 'Return statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.return")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Functions_and_function_scope">関数</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Closures">クロージャ</a></li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/switch/index.html b/files/ja/web/javascript/reference/statements/switch/index.html
new file mode 100644
index 0000000000..91960fb4ca
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/switch/index.html
@@ -0,0 +1,298 @@
+---
+title: switch
+slug: Web/JavaScript/Reference/Statements/switch
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - Web
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/switch
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><span class="seoSummary"><strong><code>switch</code> 文</strong>は<a href="/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators">式</a>を評価し、その式の値が <code>case</code> 節と一致した場合は、その <code>case</code> に関連付けられた<a href="/ja/docs/Web/JavaScript/Reference/Statements">文</a>を実行し、一致した <code>case</code> の後にある文も同様に実行します。</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-switch.html", "taller")}}</div>
+
+<p class="hidden">このインタラクティブなサンプルのソースは GitHub リポジトリに保存されています。インタラクティブなサンプルプロジェクトに貢献したい場合は <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンして、プルリクエストを送信してください。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox">switch (<var>expression</var>) {
+  case <var>value1</var>:
+    // 式の結果が value1 に一致する場合に実行する文
+    [break;]
+  case <var>value2</var>:
+    // 式の結果が value2 に一致する場合に実行する文
+    [break;]
+  ...
+  case <var>valueN</var>:
+    // 式の結果が valueN に一致する場合に実行する文
+    [break;]
+  [default:
+    // 式の値に一致するものが存在しない場合に実行する文
+    [break;]]
+}</pre>
+
+<dl>
+ <dt><code><var>expression</var></code></dt>
+ <dd>結果が各 <code>case</code> 節と一致するか調べる式。</dd>
+ <dt><code>case <var>valueN</var></code> {{optional_inline}}</dt>
+ <dd><code><var>expression</var></code> との照合に使用される <code>case</code> 節。 <code><var>expression</var></code> が特定の <code><var>valueN</var></code> と一致する場合、 <code>case</code> 節の中の処理は、 <code>switch</code> 文の末尾または <code>break</code> のいずれかに達するまで実行されます。</dd>
+ <dt><code>default</code> {{optional_inline}}</dt>
+ <dd><code>default</code> 節。 <code><var>expression</var></code> の値が <code>case</code> 節のいずれとも一致しない場合、この節が実行されます。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>switch</code> 文はまず始めに式を評価します。次に、式が入力式の結果と評価される値が等しい最初の <code>case</code> 節を (<a href="/ja/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">厳密等価演算子</a> <code>===</code> を使用して) 探し、その節に制御を移して、関連する処理を実行します。 (複数の <code>case</code> 節の値が指定された値と一致する場合、 <code>case</code> 節が互いに等しくなくても、最初に一致した <code>case</code> 節が選択されます。)</p>
+
+<p>一致する <code>case</code> 節が見つからない場合、プログラムは省略可能な <code>default</code> 節を探し、見つかればその節に制御を移し、関連する文を実行します。<code>default</code> 節が見つからない場合、プログラムは <code>switch</code> の終了に続く文で実行を続けます。慣習では、<code>default</code> 節は最後の節ですが、そうである必要はありません。</p>
+
+<p>省略可能な <code><a href="/ja/docs/Web/JavaScript/Reference/Statements/break" title="JavaScript/Reference/Statements/break">break</a></code> 文は、各 <code>case</code> 節のラベルに関連付けられれており、一致した文を一回実行した後で <code>switch</code> を抜け出し、 <code>switch</code> に続く文から実行を継続することを保証します。もし <code>break</code> が省略されたら、プログラムは <code>switch</code> 文の中の次の文から実行を継続します。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_switch" name="Using_switch"><code>switch</code> の使用</h3>
+
+<p>次の例では、 <code>expr</code> が <code>Bananas</code> と評価された場合、プログラムは <code>case 'Bananas'</code> で値に一致し、関連付けられた文を実行します。 <code>break</code> と遭遇したとき、プログラムは <code>switch</code> から抜け出し、 <code>switch</code> に続く文を実行します。 <code>break</code> が省略された場合は、 <code>case 'Cherries'</code> に対する文も実行されます。</p>
+
+<pre class="brush: js">switch (expr) {
+  case 'Oranges':
+    console.log('Oranges are $0.59 a pound.');
+    break;
+  case 'Apples':
+    console.log('Apples are $0.32 a pound.');
+    break;
+  case 'Bananas':
+    console.log('Bananas are $0.48 a pound.');
+    break;
+  case 'Cherries':
+    console.log('Cherries are $3.00 a pound.');
+    break;
+  case 'Mangoes':
+  case 'Papayas':
+    console.log('Mangoes and papayas are $2.79 a pound.');
+    break;
+  default:
+    console.log('Sorry, we are out of ' + expr + '.');
+}
+
+console.log("Is there anything else you'd like?");
+</pre>
+
+<h3 id="What_happens_if_I_forgot_a_break" name="What_happens_if_I_forgot_a_break"><code>break</code> を置かないとどうなるか</h3>
+
+<p><code>break</code> を置かな買った場合、スクリプトは基準を満たす <code>case</code> から実行され、その後の <code>case</code> も</p>
+
+<p>条件に合うかに関係なく実行されます。</p>
+
+<p>こちらの例をご覧ください。</p>
+
+<pre class="brush: js">var foo = 0;
+switch (foo) {
+  case -1:
+    console.log('negative 1');
+    break;
+  case 0: // foo は 0 であり、基準を満たすためでこのブロックを実行する
+    console.log(0);
+    // メモ: ここに break を置くのを忘れている
+  case 1: // 'case 0:' に break 文がないため、この case も実行される
+    console.log(1);
+    break; // この break に当たるため、'case 2:' には続かない
+  case 2:
+    console.log(2);
+    break;
+  default:
+    console.log('default');
+}</pre>
+
+<h3 id="Can_I_put_a_default_between_cases" name="Can_I_put_a_default_between_cases">case の間に <code>default</code> を置くことはできるか</h3>
+
+<p>はい、できます！ 一致するものが見つからない場合、 JavaScript は <code>default</code> に戻ります。</p>
+
+<pre class="brush: js">var foo = 5;
+switch (foo) {
+  case 2:
+    console.log(2);
+    break; // この break に当たれば 'default:' に継続されることはない
+  default:
+    console.log('default')
+    // 落下
+  case 1:
+    console.log('1');
+}
+</pre>
+
+<p>他のすべての <code>case</code> の前に <code>default</code> を設定した場合にも機能します。</p>
+
+<h3 id="Methods_for_multi-criteria_case" name="Methods_for_multi-criteria_case">複数基準の <code>case</code> の使用法</h3>
+
+<p>この技法の出典はこちらです:</p>
+
+<p><a href="http://stackoverflow.com/questions/13207927/switch-statement-multiple-cases-in-javascript">Switch statement multiple cases in JavaScript (Stack Overflow)</a></p>
+
+<h4 id="Multi-case_single_operation" name="Multi-case_single_operation">複数の <code>case</code> とひとつの操作の対応付け</h4>
+
+<p>この方法は、 <code>case</code> 節の配下に <code>break</code> がない場合に、次の <code>case</code> も基準を満たすかに関係なく実行されるという事実を活用します。 (<a href="What_happens_if_I_forgot_a_break"><code>break</code> を置かないとどうなるか</a>の節をご覧ください。)</p>
+
+<p>これは連続した <code>case</code> 文でひとつの操作を行う例であり、4つの異なる値でまったく同じ操作を行います。</p>
+
+<pre class="brush: js">var Animal = 'Giraffe';
+switch (Animal) {
+  case 'Cow':
+  case 'Giraffe':
+  case 'Dog':
+  case 'Pig':
+    console.log('This animal will go on Noah\'s Ark.');
+    break;
+  case 'Dinosaur':
+  default:
+    console.log('This animal will not.');
+}</pre>
+
+<h4 id="Multi-case_chained_operations" name="Multi-case_chained_operations">複数の <code>case</code> と一連の操作</h4>
+
+<p>これは一連の <code>case</code> 節と複数の操作の例であり、与えられた整数によって、異なる出力を行います。ここから実行されるのが <code>case</code> 節を置いた順であり、数値の順とは限らないことが分かります。 JavaScript では、これらの <code>case</code> 文の中に文字列の定義を混入することもできます。</p>
+
+<pre class="brush: js">var foo = 1;
+var output = 'Output: ';
+switch (foo) {
+  case 0:
+    output += 'So ';
+  case 1:
+    output += 'What ';
+    output += 'Is ';
+  case 2:
+    output += 'Your ';
+  case 3:
+    output += 'Name';
+  case 4:
+    output += '?';
+    console.log(output);
+    break;
+  case 5:
+    output += '!';
+    console.log(output);
+    break;
+  default:
+    console.log('Please pick a number from 0 to 5!');
+}</pre>
+
+<p>この例の出力は以下のとおりです:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">値</th>
+   <th scope="col">出力するテキスト</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>foo</code> が <code>NaN</code> であるか、 <code>1</code>, <code>2</code>, <code>3</code>, <code>4</code>, <code>5</code>, <code>0</code> のいずれでもない</td>
+   <td>Please pick a number from 0 to 5!</td>
+  </tr>
+  <tr>
+   <td><code>0</code></td>
+   <td>Output: So What Is Your Name?</td>
+  </tr>
+  <tr>
+   <td><code>1</code></td>
+   <td>Output: What Is Your Name?</td>
+  </tr>
+  <tr>
+   <td><code>2</code></td>
+   <td>Output: Your Name?</td>
+  </tr>
+  <tr>
+   <td><code>3</code></td>
+   <td>Output: Name?</td>
+  </tr>
+  <tr>
+   <td><code>4</code></td>
+   <td>Output: ?</td>
+  </tr>
+  <tr>
+   <td><code>5</code></td>
+   <td>Output: !</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Block-scope_variables_within_switch_statements" name="Block-scope_variables_within_switch_statements"><code>switch</code> 文の中のブロックスコープの変数</h3>
+
+<p>ECMAScript 2015 (ES6) に対応している最近のブラウザーでは、 {{jsxref("Statements/let", "let")}} および {{jsxref("Statements/const", "const")}} 文を使用してブロックスコープを持つ変数を宣言したい場合があるでしょう。</p>
+
+<p>この例を見てみてください。</p>
+
+<pre class="brush: js">const action = 'say_hello';
+switch (action) {
+  case 'say_hello':
+    let message = 'hello';
+    console.log(message);
+    break;
+  case 'say_hi':
+    let message = 'hi';
+    console.log(message);
+    break;
+  default:
+    console.log('Empty action received.');
+    break;
+}</pre>
+
+<p>この例では、おそらく予想していなかった <code>Uncaught SyntaxError: Identifier 'message' has already been declared</code> エラーを出力します。</p>
+
+<p>これは、最初の <code>let message = 'hello';</code> と次の let 文 <code>let message = 'hi';</code> が競合しているためで、それぞれ別々な case 節である <code>case 'say_hello':</code> と <code>case 'say_hi':</code> に含まれていても発生します。つまるところ、これは両方の <code>let</code> 文が同じブロックスコープ内で同じ変数名の宣言を重複して行ったと解釈されます。</p>
+
+<p>これは、 <code>case</code> 節を中括弧で囲むことで簡単に修正することができます。</p>
+
+<pre class="brush: js">const action = 'say_hello';
+switch (action) {
+  case 'say_hello': <strong>{ // 中括弧を追加</strong>
+    let message = 'hello';
+    console.log(message);
+    break;
+  <strong>} // 中括弧を追加</strong>
+  case 'say_hi': <strong>{ // 中括弧を追加</strong>
+    let message = 'hi';
+    console.log(message);
+    break;
+  <strong>} // 中括弧を追加</strong>
+  default: <strong>{ // 中括弧を追加</strong>
+    console.log('Empty action received.');
+    break;
+  <strong>} // 中括弧を追加</strong>
+}</pre>
+
+<p>このコードは仕様通り <code>hello</code> をコンソールに出力し、エラーは全く発生しません。</p>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<p class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</p>
+
+<p>{{Compat("javascript.statements.switch")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/if...else", "if...else")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/throw/index.html b/files/ja/web/javascript/reference/statements/throw/index.html
new file mode 100644
index 0000000000..dfcd342586
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/throw/index.html
@@ -0,0 +1,185 @@
+---
+title: throw
+slug: Web/JavaScript/Reference/Statements/throw
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/throw
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>throw</code> 文</strong>は、ユーザー定義の例外を発生させます。現在の関数の実行は停止し (<code>throw</code> の後の文は実行されません)、コールスタック内の最初の <a href="/ja/docs/Web/JavaScript/Reference/Statements/try...catch"><code>catch</code></a> ブロックに制御を移します。呼び出し元の関数に <code>catch</code> ブロックが存在しない場合は、プログラムが終了します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-throw.html", "taller")}}</div>
+
+<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox">throw <em>expression</em>; </pre>
+
+<dl>
+ <dt><code>expression</code></dt>
+ <dd>発生させる例外の式です。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>throw</code> 文を使用して例外を発生させることができます。例外を発生させるときは、 <code>expression</code> で例外の値を指定します。以下のいずれもが例外を発生させます。</p>
+
+<pre class="brush: js">throw 'Error2'; // 文字列値である例外を生成します
+throw 42;       // 値 42 である例外を生成します
+throw true;     // 値 true である例外を生成します
+throw new Error('Required');  // Required というメッセージを持ったエラーオブジェクトを生成します
+</pre>
+
+<p>また、 <code>throw</code> 文は <code>throw</code> キーワードと式の間に改行が許されていないため、<a href="/ja/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion">自動セミコロン挿入 (ASI)</a> の影響を受けます。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Throw_an_object" name="Throw_an_object">オブジェクトで例外を発生させる</h3>
+
+<p>例外を派生させるときにオブジェクトを指定することができます。そうすれば、 <code>catch</code> ブロックの中でそのオブジェクトのプロパティを参照できます。次の例は、 <code>UserException</code> 型のオブジェクトを生成し、それを <code>throw</code> 文の中で使っています。</p>
+
+<pre class="brush: js">function UserException(message) {
+   this.message = message;
+   this.name = 'UserException';
+}
+function getMonthName(mo) {
+   mo = mo-1; // 配列の添字のために月の数を調整する (1 = Jan, 12 = Dec)
+   var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
+      'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+   if (months[mo] !== undefined) {
+      return months[mo];
+   } else {
+      throw new UserException('InvalidMonthNo');
+   }
+}
+
+try {
+   // 試みる文
+   var myMonth = 15; // 15 は範囲外であり、例外が発生する
+   var monthName = getMonthName(myMonth);
+} catch (e) {
+   monthName = 'unknown';
+   console.error(e.message, e.name); // エラーハンドラーに例外オブジェクトを渡す
+}
+</pre>
+
+<h3 id="Another_example_of_throwing_an_object" name="Another_example_of_throwing_an_object">オブジェクトで例外を発生させる他の例</h3>
+
+<p>次の例では入力文字列でアメリカの郵便番号であるかどうかをテストします。郵便番号が無効な書式を使っていた場合は、 throw 文で <code>ZipCodeFormatException</code> 型のオブジェクトを生成して例外を発生させます。</p>
+
+<pre class="brush: js">/*
+ * ZipCode オブジェクトを生成します。
+ *
+ * 郵便番号として受け入れられる書式は次のとおりです。
+ *    12345
+ *    12345-6789
+ *    123456789
+ *    12345 6789
+ *
+ * もし ZipCode コンストラクターに渡された引数が、これらのパターンの
+ * うちのどれにも一致しないのであれば、例外が発生します。
+ */
+
+function ZipCode(zip) {
+   zip = new String(zip);
+   pattern = /[0-9]{5}([- ]?[0-9]{4})?/;
+   if (pattern.test(zip)) {
+      // 郵便番号の値は文字列中で最初に一致した部分です。
+      this.value = zip.match(pattern)[0];
+      this.valueOf = function() {
+         return this.value
+      };
+      this.toString = function() {
+         return String(this.value)
+      };
+   } else {
+      throw new ZipCodeFormatException(zip);
+   }
+}
+
+function ZipCodeFormatException(value) {
+   this.value = value;
+   this.message = 'does not conform to the expected format for a zip code';
+   this.toString = function() {
+      return this.value + this.message;
+   };
+}
+
+/*
+ * これは、US の住所のためのアドレスデータを検証するスクリプトで
+ * 使われるかもしれません。
+ */
+
+const ZIPCODE_INVALID = -1;
+const ZIPCODE_UNKNOWN_ERROR = -2;
+
+function verifyZipCode(z) {
+   try {
+      z = new ZipCode(z);
+   } catch (e) {
+      if (e instanceof ZipCodeFormatException) {
+         return ZIPCODE_INVALID;
+      } else {
+         return ZIPCODE_UNKNOWN_ERROR;
+      }
+   }
+   return z;
+}
+
+a = verifyZipCode(95060);         // 95060 を返します
+b = verifyZipCode(9560);          // -1 を返します
+c = verifyZipCode('a');           // -1 を返します
+d = verifyZipCode('95060');       // 95060 を返します
+e = verifyZipCode('95060 1234');  // 95060 1234 を返します
+</pre>
+
+<h3 id="Rethrow_an_exception" name="Rethrow_an_exception">例外を再発生させる</h3>
+
+<p>例外を捕捉した後、その例外を再度発生させるために <code>throw</code> を使うことができます。次の例では、数値である例外を捕捉し、もしその値が 50 を超えるのなら、それを再度発生させます。再度発生した例外は、利用者がわかるように、囲んでいる関数または最上位にいたるまで伝播します。</p>
+
+<pre class="brush: js">try {
+   throw n; // 数値である例外を発生させる
+} catch (e) {
+   if (e &lt;= 50) {
+      // 1 から 50 の例外を操作するための文
+   } else {
+      // この例外を操作できないので、再度発生させる
+      throw e;
+   }
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-throw-statement', 'throw statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<p class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</p>
+
+<p>{{Compat("javascript.statements.throw")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/try...catch", "try...catch")}}</li>
+ <li>{{jsxref("Global_Objects/Error", "Error")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/try...catch/index.html b/files/ja/web/javascript/reference/statements/try...catch/index.html
new file mode 100644
index 0000000000..0050f7357e
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/try...catch/index.html
@@ -0,0 +1,257 @@
+---
+title: try...catch
+slug: Web/JavaScript/Reference/Statements/try...catch
+tags:
+  - Exception
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/try...catch
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>try...catch</code></strong> 文は、試す文のブロックをマークし、例外が発生したときの応答を指定します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-trycatch.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a>https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">try {
+  <em>try_statements</em>
+}
+[catch [(<em>exception_var</em>)] {
+  <em>catch_statements</em>
+}]
+[finally {
+  <em>finally_statements</em>
+}]
+</pre>
+
+<dl>
+ <dt><code><em>try_statements</em></code></dt>
+ <dd>実行される文です。</dd>
+
+ <dt><code><em>catch_statements</em></code></dt>
+ <dd><code>try</code> ブロックの中で例外が発生した場合に実行される文です。</dd>
+
+ <dt><code><em>exception_var</em></code></dt>
+ <dd>関連する <code>catch</code> 節に対して例外オブジェクトを保持する識別子です。</dd>
+
+ <dt><code><em>finally_statements</em></code></dt>
+ <dd><code>try</code> 文が完了した後に実行される文です。これらの文は、例外が発生されたり捕捉されたりしたかどうかに関係なく実行されます。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>try</code> 文は、1 つ以上の文を含む <code>try</code> ブロックにより構成されます。文が 1 つであっても、常に <code>{}</code> を使用する必要があります。1 つ以上の <code>catch</code> ブロック、または <code>finally</code> ブロックが存在する必要があります。すなわち、<code>try</code> 文には 3 つの形態があります。</p>
+
+<ul>
+ <li><code>try...catch</code></li>
+ <li><code>try...finally</code></li>
+ <li><code>try...catch...finally</code></li>
+</ul>
+
+<p><code>catch</code> ブロックは、例外が <code>try</code> ブロックの中で発生した場合に何をするかを指定する文を含みます。<code>try</code> ブロック内 (または <code>try</code> ブロック内から呼び出された関数の中) のいずれかの文で例外が発生した場合は、制御は即座に <code>catch</code> ブロックへ移ります。<code>try</code> ブロックの中で例外が発生しなかった場合は、<code>catch</code> ブロックは飛ばされます。</p>
+
+<p><code>finally</code> ブロックは、<code>try</code> ブロックおよび <code>catch</code> ブロックの実行が完了した後で実行されます。これは常に実行され、例外が発生したかどうか、捕捉されたかどうかには関係ありません。</p>
+
+<p>1 つ以上の <code>try</code> 文を入れ子にする事ができます。内側の <code>try</code> 文が <code>catch</code> ブロックを持っていない場合、それを囲んでいる <code>try</code> 文の <code>catch</code> ブロックに入ります。</p>
+
+<p><code>try</code> を使用して JavaScript の例外を処理することもできます。JavaScript の例外に関する情報は <a href="/ja/docs/Web/JavaScript/Guide">JavaScript ガイド</a>を参照してください。</p>
+
+<h3 id="Unconditional_catch-block" name="Unconditional_catch-block">無条件の catch ブロック</h3>
+
+<p><code>catch</code> ブロックが使われている場合、<code>try</code> ブロックの中から任意の例外が発生すると、<code>catch</code> ブロックが実行されます。例えば、以下のコードで例外が発生すると、制御は <code>catch</code> ブロックへ移動します。</p>
+
+<pre class="brush: js notranslate">try {
+  throw 'myException'; // 例外を生成
+}
+catch (e) {
+  // 任意の例外を操作するための文
+  logMyErrors(e); // エラーハンドラーに例外オブジェクトを渡します
+}
+</pre>
+
+<p><code>catch</code> ブロックは例外の値を保持する識別子 (上記の例では <code>e</code>) を指定します。この値は <code>catch</code> ブロックの{{Glossary("Scope", "スコープ")}}内でのみ利用できます。</p>
+
+<h3 id="Conditional_catch_clauses" name="Conditional_catch_clauses">条件付き catch ブロック</h3>
+
+<p>「条件付き <code>catch</code> ブロック」は、下記のように <code>try...catch</code> ブロックを <code>if...else if...else</code> 構造と組み合わせることで作成することができます。</p>
+
+<pre class="brush: js notranslate">try {
+  myroutine(); // 3 つの例外を投げる可能性があります
+} catch (e) {
+  if (e instanceof TypeError) {
+    // TypeError 例外を処理するための文
+  } else if (e instanceof RangeError) {
+    // RangeError 例外を処理するための文
+  } else if (e instanceof EvalError) {
+    // EvalError 例外を処理するための文
+  } else {
+    // 任意の指定されていない例外を操作するための文
+    logMyErrors(e); // エラーハンドラーに例外オブジェクトを渡す
+  }
+}
+</pre>
+
+<p>よくある使用例としては、次のように想定済みの一部のエラーのみを捕捉 (および無視) し、それ以外の場合はエラーを送出し直す場合です。</p>
+
+<pre class="brush: js notranslate">try {
+  myRoutine();
+} catch (e) {
+  if (e instanceof RangeError) {
+    // 頻発する想定済みのエラーを処理する文
+  } else {
+    throw e;  // エラーを変更しないまま送出し直す
+  }
+}
+</pre>
+
+<h3 id="The_exception_identifier" name="The_exception_identifier">例外識別子</h3>
+
+<p>例外が <code>try</code> ブロックの中で投げられたときは、<em><code>exception_var</code></em> (たとえば、<code>catch (e)</code> における <code>e</code>) が例外の値を保持します。この識別子を使用して、発生した例外についての情報を取得することができます。この識別子は <code>catch</code> ブロックの{{Glossary("Scope", "スコープ")}}でのみ利用できます。</p>
+
+<pre class="brush: js notranslate">function isValidJSON(text) {
+  try {
+    JSON.parse(text);
+    return true;
+  } catch {
+    return false;
+  }
+}
+</pre>
+
+<h3 id="The_finally-block" name="The_finally-block">finally ブロック</h3>
+
+<p><code>finally</code> ブロックには、<code>try</code> ブロックおよび <code>catch</code> ブロックを実行した後で、<code>try...catch...finally</code> の次の文が実行される前に実行される文が入ります。なお、<code>finally</code> ブロックは例外が発生するかどうかにかかわらず実行されます。また、例外が発生した場合、<code>finally</code> ブロックは例外を処理する <code>catch</code> ブロックがなくても実行されます。</p>
+
+<p>次の例では <code>finally</code> ブロックの一つの使用例を示します。このコードはファイルを開き、それからファイルを使用する分を実行します。<code>finally</code> ブロックは、例外が発生したとしてもその後で確実にファイルを閉じるよう保証します。</p>
+
+<pre class="brush: js notranslate">openMyFile();
+try {
+  // リソースを結び付けます
+  writeMyFile(theData);
+}
+finally {
+  closeMyFile(); // リソースを常に閉じます
+}
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Nested_try-blocks" name="Nested_try-blocks">入れ子になった try ブロック</h3>
+
+<p>最初に、次のもので何が起きるか見てみましょう。</p>
+
+<pre class="brush: js notranslate">try {
+  try {
+    throw new Error('oops');
+  } finally {
+    console.log('finally');
+  }
+} catch (ex) {
+  console.error('outer', ex.message);
+}
+
+// Output:
+// "finally"
+// "outer" "oops"
+</pre>
+
+<p>ここで、既に内部の <code>try</code> ブロックに <code>catch</code> ブロックを追加しているので、既に例外を捕捉しています。</p>
+
+<pre class="brush: js notranslate">try {
+  try {
+    throw new Error('oops');
+  } catch (ex) {
+    console.error('inner', ex.message);
+  } finally {
+    console.log('finally');
+  }
+} catch (ex) {
+  console.error('outer', ex.message);
+}
+
+// Output:
+// "inner" "oops"
+// "finally"
+</pre>
+
+<p>そして、エラーを送りなおします。</p>
+
+<pre class="brush: js notranslate">try {
+  try {
+    throw new Error('oops');
+  } catch (ex) {
+    console.error('inner', ex.message);
+    throw ex;
+  } finally {
+    console.log('finally');
+  }
+} catch (ex) {
+  console.error('outer', ex.message);
+}
+
+// Output:
+// "inner" "oops"
+// "finally"
+// "outer" "oops"
+</pre>
+
+<p>送り直されない限り、例外はどれでも最も内側の <code>catch</code> ブロックで一度だけ捕捉されます。もちろん、何らかの例外が「内側の」のブロックで発生した場合 (<code>catch</code> ブロックのコードで例外が発生することを行った場合)、「外側の」ブロックで捕捉されます。</p>
+
+<h3 id="Returning_from_a_finally_block" name="Returning_from_a_finally_block">finally ブロックからの return</h3>
+
+<p><code>finally</code> ブロックが値を返した場合、<code>try</code> ブロックや <code>catch</code> ブロックの <code>return</code> 文に関係なく、その値が <code>try-catch-finally</code> 全体の返値になります。これは <code>catch</code> ブロック内で送出された例外も含みます。</p>
+
+<pre class="brush: js notranslate">(function() {
+  try {
+    try {
+      throw new Error('oops');
+    } catch (ex) {
+      console.error('inner', ex.message);
+      throw ex;
+    } finally {
+      console.log('finally');
+      return;
+    }
+  } catch (ex) {
+    console.error('outer', ex.message);
+  }
+})();
+
+// Output:
+// "inner" "oops"
+// "finally"</pre>
+
+<p>外側の "oops" は <code>finally</code> ブロックに return があるため送出されません。同じことが、<code>catch</code> ブロックから返されているそのほかの値にも適用されます。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-try-statement', 'try statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>
+
+
+
+<p>{{Compat("javascript.statements.try_catch")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("Statements/throw", "throw")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/var/index.html b/files/ja/web/javascript/reference/statements/var/index.html
new file mode 100644
index 0000000000..23cc8fe37c
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/var/index.html
@@ -0,0 +1,246 @@
+---
+title: var
+slug: Web/JavaScript/Reference/Statements/var
+tags:
+  - JavaScript
+  - Language feature
+  - Reference
+  - Statement
+  - 文
+  - 言語機能
+translation_of: Web/JavaScript/Reference/Statements/var
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong><code>var</code> 文</strong>は関数スコープまたはグローバルスコープの変数を宣言し、任意でそれをある値に初期化します。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-var.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">var <var>varname1</var> [= <var>value1</var>] [, <var>varname2</var> [= <var>value2</var>] ... [, <var>varname<strong>N</strong></var> [= <var>value<strong>N</strong></var>]]];</pre>
+
+<dl>
+ <dt><code><var>varname<strong>N</strong></var></code></dt>
+ <dd>変数名。任意の有効な識別子。</dd>
+</dl>
+
+<dl>
+ <dt><code><var>value<strong>N</strong></var></code> {{optional_inline}}</dt>
+ <dd>その変数の初期値です。有効な式なら何でも取ることができます。既定値は <code>undefined</code> です。</dd>
+</dl>
+
+<p>あるいは、<a href="https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">分割代入</a>を使用して変数を宣言することもできます。
+
+</p><pre class="notranslate">var <var>{ bar }</var> = <em>foo</em>; // where foo = { bar:10, baz:12 };
+/* これは、値が 10 の「bar」という名前の変数を作成します。 */</pre>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>var</code> 宣言は、現れる場所に関係なく、コードを実行する前に処理されます。これは<dfn>巻き上げ</dfn>と呼ばれており、後述します。</p>
+
+<p><code>var</code> で宣言された変数のスコープは、その現在の<em>実行コンテキストとそのクロージャ</em>であり、その中で宣言された関数、あるいは関数の外で宣言された変数の場合はグローバルになります。<code>var</code> を使用して変数を重複して宣言しても、厳格モードであってもエラーは発生せず、別の代入が実行されない限り、変数の値は失われません。</p>
+
+<pre class="brush: js notranslate">'use strict';
+function foo() {
+  var x = 1;
+  function bar() {
+    var y = 2;
+    console.log(x); // 1 (function `bar` closes over `x`)
+    console.log(y); // 2 (`y` is in scope)
+  }
+  bar();
+  console.log(x); // 1 (`x` is in scope)
+  console.log(y); // ReferenceError in strict mode, `y` is scoped to `bar`
+}
+
+foo();
+</pre>
+
+<p><code>var</code> を使用して宣言された変数は、コードが実行されるよりも前に生成され、これは巻き上げと呼ばれています。これらの変数の初期値は <code>undefined</code> です。</p>
+
+<pre class="brush: js notranslate">'use strict';
+console.log(x);                // undefined (注: ReferenceError ではない)
+console.log('still going...'); // still going...
+var x = 1;
+console.log(x);                // 1
+console.log('still going...'); // still going...</pre>
+
+<p>グローバルコンテキストにおいては、<code>var</code> を使用して宣言された変数は、グローバルオブジェクトの構成不可能なプロパティとして追加されます。これは、プロパティ記述子を変更することができず、{{jsxref("delete")}} を使用して削除することができないことを意味します。対応する名前は <a href="https://www.ecma-international.org/ecma-262/10.0/index.html#sec-global-environment-records">グローバル環境レコード</a> (グローバル字句環境の一部の形) 内部の <code>[[VarNames]]</code> スロットにも追加されます。<code>[[VarNames]]</code> 内の名前のリストにより、ランタイムがグローバル変数とグローバルオブジェクトの直接のプロパティを区別することができます。</p>
+
+<p>グローバル変数用のグローバルオブジェクトに作成されたプロパティは、グローバルオブジェクトの直接のプロパティではなく、識別子を変数として扱うことになるため、構成不可に設定されています。JavaScript には自動メモリー管理機能があるため、グローバル変数に <code>delete</code> 演算子を使えるようにしても意味がありません。</p>
+
+<pre class="brush: js notranslate">'use strict';
+var x = 1;
+globalThis.hasOwnProperty('x'); // true
+delete globalThis.x; // 厳格モードでは TypeError。それ以外の場合は暗黙に失敗します。
+delete x;  // 厳格モードでは SyntaxError。それ以外の場合は暗黙に失敗します。
+</pre>
+
+<p>なお、NodeJS の <a href="http://www.commonjs.org/">CommonJS</a> モジュールとネイティブの <a href="/ja/docs/Web/JavaScript/Guide/Modules">ECMAScript モジュール</a>のどちらも、最上位の変数宣言はそのモジュールのスコープとなるので、グローバルオブジェクトのプロパティとしては追加されません。</p>
+
+<h3 id="Unqualified_identifier_assignments" name="Unqualified_identifier_assignments">無修飾の識別子の代入</h3>
+
+<p>グローバルオブジェクトは、スコープチェインの最上位に位置します。名前を値に解決しようとすると、スコープチェインが検索されます。これは、グローバルオブジェクトのプロパティをすべてのスコープから、<code>globalThis.</code> や <code>window.</code> や <code>global.</code> などの修飾名なしで便利に見ることができることを意味します。</p>
+
+<p>ですから、次のように記述することができます。</p>
+
+<pre class="brush: js notranslate">function foo() {
+  String('s') // `String` 関数が暗黙に見える
+}</pre>
+
+<p>...したがって、</p>
+
+<pre class="brush: js notranslate">globalThis.hasOwnProperty('String') // true</pre>
+
+<p>つまり、グローバルオブジェクトは最終的に修飾されていない識別子を検索することになります。globalThis.String と記述する必要はなく、修飾されていない <code>String</code> と記述すればよいのです。厳格モードでない場合は、スコープチェインで宣言されている同名の変数がない場合は、グローバルオブジェクト上にその名前のプロパティを作成しようとしていると仮定して、非修飾識別子に代入することになります。</p>
+
+<pre class="brush: js notranslate">foo = 'f' // 厳格モードでない場合は、`foo` という名前のプロパティを作成しようとしていると見なす
+globalThis.hasOwnProperty('foo') // true
+</pre>
+
+<p>ECMAScript 5 において、この動作は<a href="/ja/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">厳格モード</a>で変更されました。厳格モードで修飾されていない識別子への代入しようとすると、<code>ReferenceError</code> が発生し、グローバルオブジェクトに意図せずプロパティが生成されることを防ぎます。</p>
+
+<p>上記の意味合いは、一般的に誤解されていますが、JavaScript には暗黙の変数や宣言されていない変数をは存在せず、単にそのように見える構文を持っているだけだということに注意してください。</p>
+
+<h3 id="var_hoisting" name="var_hoisting">var の巻き上げ</h3>
+
+<p>変数の宣言 (および一般的な宣言) はコードを実行する前に処理されますので、変数はコード内のどこで宣言しても、コードの先頭で宣言したものと等価になります。また、変数を宣言する前に変数を使用することもできます。この動作は、変数の宣言が関数やグローバルのコードの先頭に移動したように見えるため、"<dfn>巻き上げ</dfn> (hoisting)" と呼ばれます。</p>
+
+<pre class="brush: js notranslate">bla = 2;
+var bla;
+
+// 次のように見なされます。
+
+var bla;
+bla = 2;
+</pre>
+
+<p>このため、変数は常にスコープ (グローバルのコードまたは関数のコード) の先頭で宣言することをお勧めします。そうすればどの変数が関数スコープ (ローカル) であるか、あるいはスコープチェインによって解決されたものかが明確になります。</p>
+
+<p>ここで重要なのは、巻き上げは変数の宣言には影響しますが、値の初期化には影響しないということです。値は、実際には代入文に到達したときに代入されます。</p>
+
+<pre class="brush: js notranslate">function do_something() {
+  console.log(bar); // undefined
+  var bar = 111;
+  console.log(bar); // 111
+}
+
+// ...これは、暗黙的には次のように解釈されます。
+
+function do_something() {
+  var bar;
+  console.log(bar); // undefined
+  bar = 111;
+  console.log(bar); // 111
+}
+</pre>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Declaring_and_initializing_two_variables" name="Declaring_and_initializing_two_variables">二つの変数を宣言して初期化する</h3>
+
+<pre class="brush: js notranslate">var a = 0, b = 0;
+</pre>
+
+<h3 id="Assigning_two_variables_with_single_string_value" name="Assigning_two_variables_with_single_string_value">二つの変数に一つの文字列を代入する</h3>
+
+<pre class="brush: js notranslate">var a = 'A';
+var b = a;
+
+// 以下と等価です
+
+var a, b = a = 'A';
+</pre>
+
+<p>順番に注意してください。</p>
+
+<pre class="brush: js notranslate">var x = y, y = 'A';
+console.log(x + y); // undefinedA
+</pre>
+
+<p>ここではコードを実行する前に <code>x</code> と <code>y</code> が宣言され、そのあとに代入を行います。"<code>x = y</code>" を実行したとき、<code>y</code> が存在しますので <code>ReferenceError</code> は発生せず、値は <code>undefined</code> になります。よって、<code>x</code> に undefined 値が代入されます。そして、<code>y</code> に値 'A' が代入されます。その結果、1 行目の後は <code>x === undefined &amp;&amp; y === 'A'</code> となり、最終結果に至ります。</p>
+
+<h3 id="Initialization_of_several_variables" name="Initialization_of_several_variables">複数の変数を初期化する</h3>
+
+<pre class="brush: js notranslate">var x = 0;
+function f() {
+  var x = y = 1; // x はローカルで宣言されます。y は違います!
+}
+f();
+
+console.log(x, y); // 0 1
+
+// 厳格モードではない場合:
+// x は想定どおり、グローバル側の変数です。
+// しかし、y は関数の外部に漏れ出ています!</pre>
+
+<p>上記と同じ例を厳格モードで実行した場合:</p>
+
+<pre class="brush: js notranslate">'use strict';
+
+var x = 0;
+function f() {
+  var x = y = 1; // 厳格モードでは ReferenceError が発生します。
+}
+f();
+
+console.log(x, y);</pre>
+
+<h3 id="Implicit_globals_and_outer_function_scope" name="Implicit_globals_and_outer_function_scope">暗黙のグローバル変数と関数スコープの外部</h3>
+
+<p>暗黙的にグローバルに現れた変数は、関数スコープの外部で参照することができます：</p>
+
+<pre class="brush: js notranslate">var x = 0; // x はファイルスコープで宣言して、値 0 を代入
+
+console.log(typeof z); // z はまだ存在していないため、undefined になる
+
+function a() { // a を呼び出すと、
+  var y = 2; // y を関数 a のスコープで宣言して、値 2 を代入
+
+  console.log(x, y); // 0 2
+
+  function b() {
+    x = 3; // ファイルスコープにある x に 3 を代入
+    y = 4; // 外側の y に 4 を代入
+    z = 5; // 新たなグローバル変数 z を生成して、値 5 を代入
+           // (厳格モードでは ReferenceError が発生)
+  }
+
+  b(); // グローバル変数として z を生成
+  console.log(x, y, z); // 3 4 5
+}
+
+a(); // b も呼び出す
+console.log(x, z);     // 3 5
+console.log(typeof y); // y は関数 a のローカル変数であるため "undefined" になる</pre>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-variable-statement', 'variable statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2>
+
+
+
+<p>{{Compat("javascript.statements.var")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/let", "let")}}</li>
+ <li>{{jsxref("Statements/const", "const")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/while/index.html b/files/ja/web/javascript/reference/statements/while/index.html
new file mode 100644
index 0000000000..fa6e87907e
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/while/index.html
@@ -0,0 +1,84 @@
+---
+title: while
+slug: Web/JavaScript/Reference/Statements/while
+tags:
+  - JavaScript
+  - Language feature
+  - Statement
+  - while
+translation_of: Web/JavaScript/Reference/Statements/while
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>while 文</strong>は、テスト条件が true と評価されている間、指定された文を実行するループを作成します。条件はその文を実行する前に評価されます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-while.html")}}</div>
+
+<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">while (<var>condition</var>)
+  <var>statement</var>
+</pre>
+
+<dl>
+ <dt><code><var>condition</var></code></dt>
+ <dd>ループを通過するごとに、その前に評価される式。この条件が true と評価された場合は、 <code><var>statement</var></code> が実行されます。条件が false と評価された場合は、実行は <code>while</code> ループの後の文に続きます。</dd>
+ <dt><code><var>statement</var></code></dt>
+ <dd>条件が true と評価されている間に実行される文。ループ内で複数の文を実行する場合は、 <a href="/ja/docs/JavaScript/Reference/Statements/block">ブロック</a>文 (<code>{ ... }</code>) を使用してそれらの文をグループ化してください。<br>
+ <br>
+ メモ: <code>break</code> 文を使用すると、条件が true と評価される前にループを停止することができます。</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_while" name="Using_while">while の使用</h3>
+
+<p>次の <code>while</code> ループは、 <code>n</code> が 3 より小さい間反復します。</p>
+
+<pre class="brush:js notranslate">var n = 0;
+var x = 0;
+
+while (n &lt; 3) {
+  n++;
+  x += n;
+}</pre>
+
+<p>それぞれの反復で、ループは <code>n</code> を増加させ、それを <code>x</code> に加えます。したがって、 <code>x</code> および <code>n</code> は次の値をとります。</p>
+
+<ul>
+ <li>最初の通過の後: <code>n</code> = 1 および <code>x</code> = 1</li>
+ <li>2 回目の通過の後: <code>n</code> = 2 および <code>x</code> = 3</li>
+ <li>3 回目の通過の後: <code>n</code> = 3 および <code>x</code> = 6</li>
+</ul>
+
+<p>3 回目の通過が完了した後、条件 <code>n</code> &lt; 3 はもはや true ではなく、ループは終了します。</p>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-while-statement', 'while statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.while")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/do...while", "do...while")}}</li>
+ <li>{{jsxref("Statements/for", "for")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/with/index.html b/files/ja/web/javascript/reference/statements/with/index.html
new file mode 100644
index 0000000000..30c8244656
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/with/index.html
@@ -0,0 +1,110 @@
+---
+title: with
+slug: Web/JavaScript/Reference/Statements/with
+tags:
+  - Deprecated
+  - JavaScript
+  - Language feature
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/with
+---
+<div class="warning">混乱させるバグや互換性問題の原因になり得るため、<code>with</code> 文の使用は推奨されません。詳しくは "説明" の章の "あいまい性の欠点" をご覧ください。</div>
+
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><strong>with 文</strong>は、文に対するスコープチェーンを拡張します。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">with (<var>expression</var>)
+  <var>statement</var>
+</pre>
+
+<dl>
+ <dt><code><var>expression</var></code></dt>
+ <dd>文を評価するときに使われるスコープチェーンに、与えられたオブジェクトを追加します。オブジェクトの周りの括弧は必須です。</dd>
+ <dt><code><var>statement</var></code></dt>
+ <dd>任意の文。複数の文を実行するためには、それらの文をグループ化するために<a href="/ja/docs/Web/JavaScript/Reference/Statements/block">ブロック</a>文 ({ ... }) を使ってください。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p>JavaScript は、スクリプトの実行コンテキストまたは非修飾名を含む関数の実行コンテキストに関連付けられたスコープチェーンを探索することにより、非修飾名を探します。 'with' 文は、その文本体の評価の間、このスコープチェーンの先頭に、与えられたオブジェクトを追加します。もし本体で使われた非修飾名がそのスコープチェーンの中のプロパティに一致するなら、その名前はそのプロパティとそのプロパティを含むオブジェクトとに結び付けられます。そうでなければ、 {{jsxref("ReferenceError")}} が発生します。</p>
+
+<div class="note"><code>with</code> の利用は非推奨であり、ECMAScript 5 の<a href="/ja/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">厳格モード</a>では禁止されています。推奨される代替案は、参照したいプロパティを持つオブジェクトを一時変数に代入することです。</div>
+
+<h3 id="Performance_pro_contra" name="Performance_pro_contra">性能上の利点と欠点</h3>
+
+<p><strong>利点:</strong> <code>with</code> 文 は、性能の悪化なしに、長ったらしいオブジェクトの参照を繰り返す必要性を減らすことにより、ファイルサイズの削減に役立ちます。'with' 文 により必要とされるスコープチェーンの変更は、計算コストが高いものではありません。'with' 文 の使用は、インタープリターが、繰り返されるオブジェクトの参照を解析するのを楽にするでしょう。しかしながら、多くの場合では、これによる利益は、望むオブジェクトへの参照を保存するための一時的な変数を使うことにより達成されるということに注意してください。</p>
+
+<p><strong>欠点:</strong> <code>with</code> 文 は、すべての非修飾名の検索に対して、指定されたオブジェクトが最初に探索されることを強制します。それゆえに、関数の仮引数および宣言されたローカル変数名に一致するすべての識別子は、'with' 文 ブロックの中では見つかるのがより遅くなるでしょう。性能が重要な場所では、'with' 文 は、関数の引数および宣言されたローカル変数の識別子を使わないコードブロックを包み込むためだけに使われるのが適切でしょう。</p>
+
+<h3 id="Ambiguity_contra" name="Ambiguity_contra">あいまい性の欠点</h3>
+
+<p><strong>欠点:</strong> <code>with</code> 文 は、非修飾名がスコープチェーンの中で見つかるかどうか、もし見つかるならどのオブジェクトの中でかを、人間の読み手または JavaScript コンパイラーが決定するのを難しくします。つまり、以下の例を見てください。</p>
+
+<pre class="brush: js notranslate">function f(x, o) {
+  with (o) {
+    console.log(x);
+  }
+}</pre>
+
+<p><code>f</code> が呼び出されたときのみ、<code>x</code> が見つかるかどうか、もし見つかるなら、<code>o</code> の中でか、または (そのようなプロパティが存在しなければ) <code>f</code> のアクティベーションオブジェクト――そこで、<code>x</code> は最初の仮引数の名前です――の中でか、が決定されます。もし第 2 引数として渡したオブジェクトの中で <code>x</code> を定義するのを忘れた、または何らかの似たようなバグあるいは混乱があったのなら、エラーが起きることなく、ただ予期しない結果が得られるでしょう。</p>
+
+<p><strong>欠点:</strong> <code>with</code> を使用したコードは前方互換性がない可能性があります。普通のオブジェクト以外のものと使用した場合に顕著です。以下の例で考えましょう。</p>
+
+<div>
+<pre class="brush:js notranslate">function f(foo, values) {
+  with (foo) {
+    console.log(values);
+  }
+}
+</pre>
+
+<p>ECMAScript 5 環境で <code>f([1,2,3], obj)</code> を呼び出すと、<code>with</code> 文の中にある <code>values</code> の参照先は <code>obj</code> に解決されます。ところが、ECMAScript 2015 では {{jsxref("Array.prototype")}} に <code>values</code> プロパティが導入されました (よって、すべての配列で使用できます)。従って ECMAScript 2015 に対応する JavaScript 環境では、 <code>with</code> 文の内部にある <code>values</code> の参照先は <code>[1,2,3].values</code> になります。ただし、この例に限って言えば、 {{jsxref("Array.prototype")}} では <code>values</code> が {{jsxref("Symbol.unscopables")}} オブジェクトの中に定義されています。もしそうでなければ、デバッグが困難な問題であることがわかります。</p>
+</div>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="Using_with" name="Using_with">with の使用</h3>
+
+<p>次の <code>with</code> 文は、 {{jsxref("Math")}} オブジェクトが既定のオブジェクトであると指定しています。<code>with</code> 文内の複数の文は、オブジェクトを指定することなく、 {{jsxref("Math.PI", "PI")}} プロパティ、 {{jsxref("Math.cos", "cos")}} メソッド、および {{jsxref("Math.sin", "sin")}} メソッドを参照しています。JavaScript は、これらの参照に対して <code>Math</code> オブジェクトを仮定します。</p>
+
+<pre class="brush:js notranslate">var a, x, y;
+var r = 10;
+
+with (Math) {
+  a = PI * r * r;
+  x = r * cos(PI);
+  y = r * sin(PI / 2);
+}</pre>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-with-statement', 'with statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("javascript.statements.with")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{jsxref("Statements/block", "block", "", 1)}}</li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">厳格モード</a></li>
+ <li>{{jsxref("Symbol.unscopables")}}</li>
+ <li>{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}</li>
+</ul>
diff --git a/files/ja/web/javascript/reference/statements/yield/index.html b/files/ja/web/javascript/reference/statements/yield/index.html
new file mode 100644
index 0000000000..fd381dc98d
--- /dev/null
+++ b/files/ja/web/javascript/reference/statements/yield/index.html
@@ -0,0 +1,6 @@
+---
+title: yield
+slug: Web/JavaScript/Reference/Statements/yield
+translation_of: Web/JavaScript/Reference/Operators/yield
+---
+<p>『 <a href="/ja/docs/JavaScript/New_in_JavaScript/1.7">JavaScript 1.7 の新機能</a>』、『<a href="/ja/docs/JavaScript/Guide/Iterators_and_Generators">イテレータとジェネレータ</a>』 を参照して下さい。</p>