diff options
author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-02-17 02:10:05 +0900 |
---|---|---|
committer | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-02-26 16:04:26 +0900 |
commit | 421527e0bbd024b162b267415960aacc31ce8b68 (patch) | |
tree | ff0647ded2ab4b643d6a2bb401d72c9e020df2c4 /files/ja/web | |
parent | 8ab55f2cfcdd6d5e7b46a35f513fd6160fa449c3 (diff) | |
download | translated-content-421527e0bbd024b162b267415960aacc31ce8b68.tar.gz translated-content-421527e0bbd024b162b267415960aacc31ce8b68.tar.bz2 translated-content-421527e0bbd024b162b267415960aacc31ce8b68.zip |
2022/01/18 時点の英語版に同期
Diffstat (limited to 'files/ja/web')
-rw-r--r-- | files/ja/web/javascript/reference/operators/instanceof/index.md | 221 |
1 files changed, 117 insertions, 104 deletions
diff --git a/files/ja/web/javascript/reference/operators/instanceof/index.md b/files/ja/web/javascript/reference/operators/instanceof/index.md index a238d8b522..d2cab1f7ab 100644 --- a/files/ja/web/javascript/reference/operators/instanceof/index.md +++ b/files/ja/web/javascript/reference/operators/instanceof/index.md @@ -3,125 +3,148 @@ title: instanceof slug: Web/JavaScript/Reference/Operators/instanceof tags: - JavaScript - - Language feature - - Object - - Operator - - Prototype - - Relational Operators + - 言語機能 + - オブジェクト + - 演算子 + - プロトタイプ + - 関連演算子 - instanceof +browser-compat: javascript.operators.instanceof translation_of: Web/JavaScript/Reference/Operators/instanceof --- -<div>{{jsSidebar("Operators")}}</div> +{{jsSidebar("Operators")}} -<p><strong><code>instanceof</code></strong> 演算子は、オブジェクトが自身のプロトタイプにコンストラクタの <code>prototype</code> プロパティを持っているかを確認します。戻り値はブール値です。</p> +**`instanceof` 演算子**は、あるコンストラクターの `prototype` プロパティが、あるオブジェクトのプロトタイプチェーンの中のどこかに現れるかどうかを検査します。返値は論理値です。 -<div>{{EmbedInteractiveExample("pages/js/expressions-instanceof.html")}}</div> +{{EmbedInteractiveExample("pages/js/expressions-instanceof.html")}} +## 構文 +```js +object instanceof constructor +``` -<h2 id="Syntax" name="Syntax">構文</h2> +### 引数 -<pre class="syntaxbox notranslate"><var>object</var> instanceof <var>constructor</var></pre> +- `object` + - : 検査するオブジェクトです。 +- `constructor` + - : 検査対象の関数です。 -<h3 id="Parameters" name="Parameters">引数</h3> +## 解説 -<dl> - <dt><code><var>object</var></code></dt> - <dd>確認するオブジェクト</dd> -</dl> +`instanceof` 演算子は、`object` のプロトタイプチェーンに `constructor.prototype` が存在することを検査します。 -<dl> - <dt><code><var>constructor</var></code></dt> - <dd>オブジェクトに対して確認を行う関数</dd> -</dl> - -<h2 id="説明">説明</h2> - -<p><code>instanceof</code> 演算子は、<code>object</code> のプロトタイプチェインで <code>constructor.prototype</code> の存在を確認します。</p> - -<pre class="brush: js notranslate">// コンストラクタを定義 +```js +// コンストラクターを定義 function C() {} function D() {} let o = new C() -// true なぜなら: Object.getPrototypeOf(o) === C.prototype -o instanceof C; +// true : Object.getPrototypeOf(o) === C.prototype であるため +o instanceof C -// false D.prototype は o のプロトタイプチェーンのどこにも存在しない -o instanceof D; +// false : D.prototype は o のプロトタイプチェーンのどこにも存在しないため +o instanceof D -o instanceof Object; // true なぜなら... -C.prototype instanceof Object // true だから +o instanceof Object // true : なぜなら... +C.prototype instanceof Object // true であるため C.prototype = {} let o2 = new C() -o2 instanceof C; // true +o2 instanceof C // true -// false C.prototype は o のプロトタイプチェーンの -// どこにも存在しない -o instanceof C; +// false : C.prototype は o のプロトタイプチェーンの +// どこにも存在しないため +o instanceof C -D.prototype = new C(); // 継承を使用 +D.prototype = new C() // 継承を使用 let o3 = new D() -o3 instanceof D; // true -o3 instanceof C; // true o3 のプロトタイプチェーンに C.prototype があるため。 -</pre> +o3 instanceof D // true +o3 instanceof C // true : o3 のプロトタイプチェーンに C.prototype があるため +``` + +なお、 `instanceof` の値の検査結果はコンストラクターの `prototype` プロパティが変化すると変わることがあります。また、オブジェクトのプロトタイプを `Object.setPrototypeOf` を用いて変更した場合や、標準外の `__proto__` プロパティを用いた場合も変わることがあります。 + +### `instanceof` と複数のコンテキスト (例: frame や window) -<p>注意事項: <code>instanceof</code> による確認結果はコンストラクタの <code>prototype</code> プロパティの変化に従って変わることがあります。また、オブジェクトのプロトタイプを <code>Object.setPrototypeOf</code> を用いて変更した場合や、非標準の <code>__proto__</code> 疑似プロパティを用いた場合も変わりえます。</p> +スコープが異なると、実行環境が変わります。つまり、組み込まれているものも変わります(別々なグローバルオブジェクト、別々なコンストラクター、など)。これにより予期せぬ結果になる場合があります。例えば、`[] instanceof window.frames[0].Array` は `false` を返します。 `Array.prototype !== window.frames[0].Array.prototype` であり、配列は前者を継承しているからです。 -<h3 id="instanceof_and_multiple_context_e.g._frames_or_windows" name="instanceof_and_multiple_context_e.g._frames_or_windows"><code>instanceof</code> と複数のコンテキスト (例: frame や window)</h3> +これは、始めはわかりにくいかもしれませんが、スクリプトで複数のフレームやウィンドウを扱い、オブジェクトをあるコンテキストから別のコンテキストへ関数を経由して渡すようになると、正当かつ重要な事項になります。例えば、`Array.isArray(myObj)` を使用すると、与えられたオブジェクトが実際に配列であるかどうかを安全にチェックできます。 -<p>異なるスコープは、別々の実行環境を持ちます。つまり、それらは別々の組み込み物 (別々のグローバルオブジェクト、別々のコンストラクタ 等々) を持ちます。これにより予期せぬ結果になる場合があります。例えば、<code>[] instanceof window.frames[0].Array</code> は、<code>Array.prototype !== window.frames[0].Array</code> であることおよび配列が以前から継承していることから <code>false</code> を返します。</p> +例えば、別のコンテキストで [Node](/ja/docs/Web/API/Node) が [SVGElement](/ja/docs/Web/API/SVGElement) であるかどうかをチェックするには、`myNode instanceof myNode.ownerDocument.defaultView.SVGElement` を使用してください。 -<p>これは、始めはわかりにくいかもしれませんが、スクリプトで複数のフレームやウィンドウを扱い始め、オブジェクトをあるコンテキストから別のコンテキストへ関数を経由して渡すようになると、正当かつ重要な事項になります。例えば、<code>Array.isArray(<var>myObj</var>)</code> を使用して、与えられたオブジェクトが実際に配列であるかどうかを安全にチェックできます。</p> +## 例 -<p>例えば、別のコンテキストで <a href="/ja/docs/Web/API/Node">Nodes</a> が <a href="/ja/docs/Web/API/SVGElement">SVGElement</a> であるかどうかをチェックするには、<code>myNode instanceof myNode.ownerDocument.defaultView.SVGElement</code> を使用します。</p> +### instanceof を String に対して使用 -<div class="note"> -<p><strong>Mozilla 開発者への注意点</strong></p> +以下の例では、 `instanceof` を `String` オブジェクトに使用した場合の動作を示しています。 -<p>XPCOM を用いるコードでは <code>instanceof</code> に特別な効果があります: <code>obj instanceof <em>xpcomInterface</em></code> (例えば <code>Components.interfaces.nsIFile</code>) は <code>obj.QueryInterface(<em>xpcomInterface</em>)</code> を呼び出し、<code>QueryInterface</code> が成功した場合に <code>true</code> を返します。</p> +```js +let literalString = 'これは文字列リテラルです'; +let stringObject = new String('コンストラクターで作成された String です'); -<p>このような呼び出しの副作用として、<code>instanceof</code> による確認の成功後に <code><var>obj</var></code> の <code>xpcomInterface</code> のプロパティを利用できることがあります。標準 JavaScript の環境と異なり、<code>obj</code> が異なるスコープ由来であっても <code><var>obj</var> instanceof <var>xpcomInterface</var></code> での確認は期待どおりに動作します。</p> -</div> +literalString instanceof String; // false : 文字列リテラルは String ではない +stringObject instanceof String; // true -<h2 id="Examples" name="Examples">例</h2> +literalString instanceof Object; // false : 文字列リテラルは Object ではない +stringObject instanceof Object; // true -<h3 id="Demonstrating_that_String_and_Date_are_of_type_Object_and_exceptional_cases" name="Demonstrating_that_String_and_Date_are_of_type_Object_and_exceptional_cases"><code>String</code> や <code>Date</code> が <code>Object</code> タイプであることの実証</h3> +stringObject instanceof Date; // false +``` -<p>以下のコードは、<code>String</code> や <code>Date</code> オブジェクトが <code>Object</code> タイプでもある (<code>Object</code> から派生している) ことの実証に <code>instanceof</code> を用いています。</p> +### instanceof を Date に対して使用 -<p>また、オブジェクトリテラルを用いて作成されたオブジェクトに対する例外、つまり、prototype が <code>undefined</code> であるにも関わらず <code>instanceof Object</code> が <code>true</code> を報告する例を示します。</p> +以下の例では、 `instanceof` を `Date` オブジェクトに使用した場合の動作を示しています。 -<pre class="brush: js notranslate">let simpleStr = 'This is a simple string' -let myString = new String() -let newStr = new String('コンストラクターで作成された文字列') -let myDate = new Date() -let myObj = {} -let myNonObj = Object.create(null) +```js +let myDate = new Date(); -simpleStr instanceof String // false を返す 文字列リテラルはオブジェクトではありません。 -myString instanceof String // true を返す -newStr instanceof String // true を返す -myString instanceof Object // true を返す +myDate instanceof Date; // true +myDate instanceof Object; // true +myDate instanceof String; // false +``` -myObj instanceof Object // true を返す すべてのオブジェクトリテラルはプロトタイプとして Object.prototype を持っています。 -({}) instanceof Object // true を返す 上記と同じ -myNonObj instanceof Object // false を返す プロトタイプはプロトタイプチェーンの終わりです(null) -myString instanceof Date // false を返す +### Object.create() で生成された Object -myDate instanceof Date // true を返す -myDate instanceof Object // true を返す -myDate instanceof String // false を返す -</pre> +以下の例では、 `instanceof` を `Object.create()` で生成したオブジェクトに使用した場合の動作を示しています。 + +```js +function Shape() { +} + +function Rectangle() { + Shape.call(this); // スーパークラスのコンストラクターを呼び出す。 +} -<h3 id="Demonstrating_that_mycar_is_of_type_Car_and_type_Object" name="Demonstrating_that_mycar_is_of_type_Car_and_type_Object"><code>mycar</code> が <code>Car</code> タイプおよび <code>Object</code> タイプであることの実証</h3> +Rectangle.prototype = Object.create(Shape.prototype); -<p>以下のコードは、<code>Car</code> オブジェクトタイプとそのインスタンスである <code>mycar</code> を生成しています。<code>instanceof</code> 演算子で、<code>mycar</code> は <code>Car</code> タイプおよび <code>Object</code> タイプであることを実証します。</p> +Rectangle.prototype.constructor = Rectangle; -<pre class="brush: js notranslate">function Car(make, model, year) { +let rect = new Rectangle(); + +rect instanceof Object; // true +rect instanceof Shape; // true +rect instanceof Rectangle; // true +rect instanceof String; // false + +let literalObject = {}; +let nullObject = Object.create(null); +nullObject.name = "My object"; + +literalObject instanceof Object; // true : すべてのオブジェクトリテラルは Object.prototype をプロトタイプとして持つ +({}) instanceof Object; // true : 上記と同じ +nullObject instanceof Object; // false : プロトタイプはプロトタイプチェーンの末尾 (null) +``` + +### `mycar` が `Car` 型および `Object` 型であることを示す + +以下のコードは、`Car` オブジェクト型とそのインスタンスである `mycar` を生成しています。`instanceof` 演算子で、`mycar` は `Car` 型および `Object` 型であることを示します。 + +```js +function Car(make, model, year) { this.make = make; this.model = model; this.year = year; @@ -129,47 +152,37 @@ myDate instanceof String // false を返す let mycar = new Car('Honda', 'Accord', 1998) let a = mycar instanceof Car // true を返す let b = mycar instanceof Object // true を返す -</pre> +``` -<h3 id="Not_an_instanceof" name="Not_an_instanceof">インスタンスではないことの実証</h3> +### instanceof の否定 -<p>オブジェクトが特定のコンストラクタの <code>instanceof</code> でないかどうかを確認するには次のようにします。</p> +あるオブジェクトが特定のコンストラクターの `instanceof` でないことを検査するには、次のようにします。 -<pre class="brush: js notranslate">if (!(mycar instanceof Car)) { - // Do something, like: +```js +if (!(mycar instanceof Car)) { + // 次のようなことをします。 // mycar = new Car(mycar) } -</pre> - -<p>これは実際には次のものとは異なります。</p> - -<pre class="brush: js notranslate">if (!mycar instanceof Car)</pre> +``` -<p>これは常に <code>false</code> になります。(<code>!mycar</code> は <code>instanceof</code> の前に評価され、常に <code>Car</code> のインスタンスを確認したブール値になります)。</p> +これは実際には次のものとは異なります。 -<h2 id="Specifications" name="Specifications">仕様</h2> +```js +if (!mycar instanceof Car) +``` -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">仕様書</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}</td> - </tr> - </tbody> -</table> +これは常に `false` になります。(`!mycar` は `instanceof` の前に評価されるため、常に論理値が `Car` のインスタンスであるかどうかを検査しようとします。) -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> +## 仕様書 +{{Specifications}} +## ブラウザーの互換性 -<p>{{Compat("javascript.operators.instanceof")}}</p> +{{Compat}} -<h2 id="See_also" name="See_also">関連情報</h2> +## 関連情報 -<ul> - <li><code><a href="/ja/docs/Web/JavaScript/Reference/Operators/typeof" title="/ja/docs/JavaScript/Reference/Operators/typeof">typeof</a></code></li> - <li>{{jsxref("Symbol.hasInstance")}}</li> - <li>{{jsxref("Object.prototype.isPrototypeOf")}}</li> -</ul> +- [`typeof`](/ja/docs/Web/JavaScript/Reference/Operators/typeof) +- {{jsxref("Symbol.hasInstance")}} +- {{jsxref("Object.prototype.isPrototypeOf")}} |