diff options
| -rw-r--r-- | files/ja/web/javascript/reference/operators/void/index.md | 149 |
1 files changed, 70 insertions, 79 deletions
diff --git a/files/ja/web/javascript/reference/operators/void/index.md b/files/ja/web/javascript/reference/operators/void/index.md index d86ba34f95..438dce4996 100644 --- a/files/ja/web/javascript/reference/operators/void/index.md +++ b/files/ja/web/javascript/reference/operators/void/index.md @@ -3,100 +3,91 @@ title: void 演算子 slug: Web/JavaScript/Reference/Operators/void tags: - JavaScript - - Operator - - URIs - - Unary + - 言語機能 + - 演算子 + - リファレンス + - 単項 +browser-compat: javascript.operators.void translation_of: Web/JavaScript/Reference/Operators/void --- -<div>{{jsSidebar("Operators")}}</div> +{{jsSidebar("Operators")}} -<p><strong><code>void</code> 演算子</strong>は与えられた式 (<em>expression</em>) を評価し、{{jsxref("Global_Objects/undefined", "undefined")}} を返します。</p> +**`void` 演算子**は与えられた式 (`expression`) を評価し、{{jsxref("undefined")}} を返します。 -<h2 id="Syntax" name="Syntax">構文</h2> +{{EmbedInteractiveExample("pages/js/expressions-voidoperator.html")}} -<pre class="syntaxbox"><code>void <em>expression</em></code></pre> +## 構文 -<h2 id="Uses" name="Uses">説明</h2> +```js +void expression +``` -<p>この演算子は、<strong>「戻り値が <code>undefined</code> であってほしい場所に、それ以外の戻り値を持つ式を挿入したい場合」</strong>に有用です。</p> +## 解説 -<p><code>void</code> 演算子は単にプリミティブ値 undefined を得る目的でしばしば使われ、一般的に "<code>void(0)</code>" と書かれます（これは "<code>void 0</code>" と等価です）。この目的であれば、代わりに値が {{jsxref("Global_Objects/undefined", "undefined")}} の変数、未定義のグローバル変数などを使用する事もできます。</p> +この演算子により、何らかの値を生成する評価式を、式が {{jsxref("undefined")}} と評価されることが望ましい場面に置くことができます。 -<p><a href="/ja/docs/Glossary/IIFE">即時実行関数式</a>を使用するとき、 <code>void</code> は、<code>function</code> キーワードを宣言の代わりに式として扱うように強制するために使用できます。</p> +`void` 演算子は、よく単にプリミティブ値 `undefined` を得る目的で使われ、一般的に "`void(0)`" と書かれます（これは "`void 0`" と等価です）。この目的であれば、グローバル変数 {{jsxref("undefined")}} を使用することができます。 -<pre class="brush: js">void function iife() { - var bar = function () {}; - var baz = function () {}; - var foo = function () { - bar(); - baz(); - }; - var biz = function () {}; +なお、`void` 演算子の [優先順位](/ja/docs/Web/JavaScript/Reference/Operators/Operator_Precedence) を考慮するべきであり、括弧は `void` 演算子に続く式の解決を明確にするのに役立つとされています。 + +```js +void 2 == '2'; // (void 2) == '2', false を返す +void (2 == '2'); // void (2 == '2'), undefined を返す +``` + +## 例 + +### 即時実行関数式 + +[即時実行関数式](/ja/docs/Glossary/IIFE) を使用する場合、 `void` により `function` キーワードが宣言ではなく式として扱うよう強制することができます。 + +```js +void function iife() { + + console.log("Executed!"); - foo(); - biz(); }(); -</pre> -<h2 id="JavaScript_URIs" name="JavaScript_URIs">JavaScript URI</h2> +// Output: "Executed!" +``` + +上記の関数を `void` キーワードなしで実行すると、**捕捉されない SyntaxError** が発生します。 + +### JavaScript URI -<p><code>javascript:</code> から始まる URI をサポートしたブラウザに於いて、それは、URI 内のコードを評価し、戻り値が {{jsxref("Global_Objects/undefined", "undefined")}} でなければ、返された値にページコンテンツを置き換えます。<code>void</code> 演算子は、{{jsxref("Global_Objects/undefined", "undefined")}} を返すために使用できます。たとえば：</p> +`javascript:` の URI に対応しているブラウザーでは、 URI の中のコードを評価し、返値が {{jsxref("undefined")}} でない限り、返された値でページの内容を置き換えます。 `void` 演算子は、`undefined` を返すために使用できます。 -<pre class="brush: html"><a href="javascript:void(0);"> +```html +<a href="javascript:void(0);"> Click here to do nothing -</a> +</a> -<a href="javascript:void(document.body.style.backgroundColor='green');"> +<a href="javascript:void(document.body.style.backgroundColor='green');"> Click here for green background -</a> -</pre> - -<p>但し、<code>javascript:</code> 疑似プロトコルはあくまで控えめなイベントハンドラなどの代替であり、積極的に使用するべきではないでしょう。<br> - しかしながらこれは、戻り値を必要としないブックマークレットの作成の際などに役立つ場合があります。</p> - -<h2 id="仕様">仕様</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様</th> - <th scope="col">ステータス</th> - <th scope="col">コメント</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-void-operator', 'The void Operator')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-void-operator', 'The void Operator')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-11.4.2', 'The void Operator')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES3', '#sec-11.4.2', 'The void Operator')}}</td> - <td>{{Spec2('ES3')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES1', '#sec-11.4.2', 'The void Operator')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>初期定義。JavaScript 1.1 で実装。</td> - </tr> - </tbody> -</table> - -<h2 id="ブラウザ実装状況">ブラウザ実装状況</h2> - -<p>{{Compat("javascript.operators.void")}}</p> - -<h2 id="関連項目">関連項目</h2> - -<ul> - <li><code><a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/undefined">undefined</a></code></li> -</ul> +</a> +``` + +> **Note:** `javascript:` 擬似プロトコルは控えめなイベントハンドラーなどの代替であり、積極的に使用するべきではないでしょう。 + +### アロー関数からのリーク防止 + +アロー関数は略式の中括弧のない構文を導入しており、式を返します。 +これは、以前は何も返さなかった関数呼び出しの結果を返すことで、意図しない副作用を引き起こす可能性があります。関数の返値が使用されないことを想定している場合は、安全のため void 演算子に渡すことで、（例えば） API の変更によってアロー関数の動作が変更されないようにすることができます。 + +```js +button.onclick = () => void doSomething(); +``` + +これにより、 `doSomething` の返値が `undefined` から `true` に変わっても、このコードの動作が変わらないことが保証されます。 + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{jsxref("undefined")}} |