initial commit

1 files changed, 115 insertions, 0 deletions

diff --git a/files/ja/web/javascript/reference/operators/conditional_operator/index.html b/files/ja/web/javascript/reference/operators/conditional_operator/index.html
new file mode 100644
index 0000000000..19afa5445a
--- /dev/null
+++ b/files/ja/web/javascript/reference/operators/conditional_operator/index.html
@@ -0,0 +1,115 @@
+---
+title: 条件 (三項) 演算子
+slug: Web/JavaScript/Reference/Operators/Conditional_Operator
+tags:
+  - Conditional
+  - JS
+  - JavaScript
+  - Operator
+  - Reference
+  - ternary
+  - 三項
+  - 条件
+  - 演算子
+translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p><span class="seoSummary"><strong>条件 (三項) 演算子</strong>は JavaScript では唯一の、3 つのオペランドをとる演算子です。条件に続いて疑問符 (<code>?</code>)、そして条件が{{Glossary("truthy", "真値")}}であった場合に実行する式、コロン (<code>:</code>) が続き、条件が{{Glossary("falsy")}}であった場合に実行する式が最後に来ます。</span>この演算子は、 <a href="/ja/docs/Web/JavaScript/Reference/Statements/if...else"><code>if</code></a> 文のショートカットとしてよく用いられます。</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-conditionaloperators.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>condition</var> ? <var>exprIfTrue</var> : <var>exprIfFalse</var></pre>
+
+<h3 id="Parameters" name="Parameters">引数</h3>
+
+<dl>
+ <dt><code><var>condition</var></code></dt>
+ <dd>値が条件として使用される式です。</dd>
+ <dt><code><var>exprIfTrue</var></code></dt>
+ <dd><code><var>condition</var></code> が {{Glossary("truthy")}} の値 (<code>true</code> と等しいか、 <code>true</code> に変換できる値) と評価された場合に評価される式です。</dd>
+ <dt><code><var>exprIfFalse</var></code></dt>
+ <dd><code><var>condition</var></code> が {{Glossary("falsy")}} の値 (<code>false</code> と等しいか、 <code>false</code> に変換できる値) と評価された場合に評価される式です。</dd>
+</dl>
+
+<h2 id="Description" name="Description">解説</h2>
+
+<p><code>false</code> についていえば、 falsy になる可能性がある式は <code>null</code>, <code>NaN</code>, <code>0</code>, 空文字列 (<code>""</code>), <code>undefined</code> です。 <code><var>condition</var></code> がこのうちの何れかであれば、条件演算子の結果は <code>exprIfFalse</code> の式を実行した結果になります。</p>
+
+<h2 id="Examples" name="Examples">例</h2>
+
+<h3 id="A_simple_example" name="A_simple_example">単純な例</h3>
+
+<pre class="brush: js notranslate">var age = 26;
+var beverage = (age &gt;= 21) ? "ビール" : "ジュース";
+console.log(beverage); // "ビール"
+</pre>
+
+<h3 id="Handling_null_values" name="Handling_null_values">null 値の扱い</h3>
+
+<p>よくある使い方の一つに、 <code>null</code> になる可能性がある値を扱うというものがあります。</p>
+
+<pre class="brush: js notranslate">let greeting = person =&gt; {
+    let name = person ? person.name : `お客さん`
+    return `やあ、${name}`
+}
+
+console.log(greeting({name: `アリス`}));  // "やあ、アリス"
+console.log(greeting(null));             // "やあ、お客さん"
+</pre>
+
+<h3 id="Conditional_chains" name="Conditional_chains">条件の連鎖</h3>
+
+<p>三項演算子は右結合で、すなわち以下のような方法で <code>if … else if … else if … else</code> の連鎖と同様に「連鎖」させることができます。</p>
+
+<pre class="brush: js notranslate">function example(…) {
+    return condition1 ? value1
+         : condition2 ? value2
+         : condition3 ? value3
+         : value4;
+}
+
+// 以下のものと同等です。
+
+function example(…) {
+    if (condition1) { return value1; }
+    else if (condition2) { return value2; }
+    else if (condition3) { return value3; }
+    else { return value4; }
+}
+</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-conditional-operator', 'Conditional Operator')}}</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.operators.conditional")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Statements/if...else">if 文</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator">Null 合体演算子</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Reference/Operators/Optional_chaining">オプション連鎖</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Building_blocks/conditionals">コードでの意思決定 — 条件文</a></li>
+ <li><a href="/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators">式と演算子</a></li>
+</ul>