JavaScriptで配列かどうかを判断するためのさまざまな方法のまとめ

序文

日常の開発では、値の型を判別する必要が生じることがよくあります。今日は、配列かどうかを判断するために使用される一般的な JavaScript メソッドをいくつかまとめます。

配列.isArray

Array.isArray() は ES5 で追加された新しいメソッドで、渡された値が配列であるかどうかを判断するために使用されます。配列の場合は true を返し、そうでない場合は false を返します。

arr = [] とします。
console.log(Array.isArray(arr)); // 真

次の関数呼び出しはすべて true を返します。

配列.isArray([]);
配列.isArray([1]);
Array.isArray(新しいArray());
Array.isArray(新しいArray("a", "b", "c", "d"));

注目すべき点は、Array.prototype も実際には配列であるということです。

Array.isArray(Array.prototype); // 真

次の関数呼び出しはすべて false を返します。

配列.isArray();
配列.isArray({});
配列.isArray(null);
Array.isArray(未定義);
配列.isArray(17);
Array.isArray('配列');
配列.isArray(true);
配列.isArray(false);
Array.isArray(新しいUint8Array(32))
Array.isArray({ __proto__: Array.prototype });

互換性は以下のとおりです。

ご覧のとおり、主流のブラウザの新しいバージョンはすべてこの方法をサポートしており、安心して使用できます。

コンストラクタ

Object の各インスタンスにはコンストラクターがあり、現在のオブジェクトを作成するために使用される関数を格納するために使用されます。

arr = [] とします。
console.log(arr.constructor === 配列); // true

コンストラクターは変更されるリスクがあり、判定結果が正確でない可能性があることに注意してください。次に例を示します。

arr = [1, 2, 3]とします。
arr.コンストラクタ = 関数 () { }
console.log(arr.constructor === 配列); // false

一般的に、コンストラクターを使用して配列かどうかを判断することは推奨されません。そのようなメソッドがあることを知るだけで十分です。

インスタンス

instanceof 演算子は、コンストラクター関数のプロトタイププロパティがインスタンスオブジェクトのプロトタイプチェーンに出現するかどうかを検出するために使用されます。例えば：

// コンストラクタ関数 C() を定義する {}
関数D() {}

var o = 新しい C();

o instanceof C; // Object.getPrototypeOf(o) === C.prototype なので true

o instanceof D; // false、D.prototype は o のプロトタイプ チェーンにないため o instanceof Object; // true、Object.prototype.isPrototypeOf(o) が true を返すため
C.prototype instanceof Object; // true、上記と同じ

配列かどうかを判断するための instanceof の使用方法は次のとおりです。

arr = [] とします。
console.log(arr 配列インスタンス); // true

instanceof を使用する際に注意すべき点が 2 つあります。

コンストラクタのプロトタイプやインスタンスのプロトタイプチェーンは変更される可能性があるため、判定結果が変わらない可能性があります。
iframe を含むページスクリプトで instanceof を使用すると、iframe には独立したグローバル環境があり、異なるグローバル環境には異なるグローバルオブジェクトがあり、したがって異なる組み込み型コンストラクターがあるため、誤った結果が生じる可能性があります。

プロトタイプ

isPrototypeOf() は、オブジェクトが別のオブジェクトのプロトタイプチェーン内に存在するかどうかをテストするために使用できます。使用方法は次のとおりです。

関数 Foo() {}
関数 Bar() {}
関数 Baz() {}

Bar.prototype = Object.create(Foo.prototype);
Baz.prototype = Object.create(Bar.prototype);

var baz = new Baz();

console.log(Baz.prototype.isPrototypeOf(baz)); // 真
console.log(Bar.prototype.isPrototypeOf(baz)); // 真
console.log(Foo.prototype.isPrototypeOf(baz)); // 真
console.log(Object.prototype.isPrototypeOf(baz)); // 真

isPrototypeOf を使用して、入力パラメータが配列であるかどうかを判断する場合は、次のように使用できます。

arr = [] とします。
console.log(Array.prototype.isPrototypeOf(arr)); // 真

オブジェクト.プロトタイプ.toString

すべてのオブジェクトには toString() メソッドがあり、オブジェクトがテキスト値として表されるとき、またはオブジェクトが文字列を期待する方法で参照されるときに自動的に呼び出されます。

デフォルトでは、toString() メソッドはすべての Object オブジェクトに継承されます。このメソッドがカスタムオブジェクトでオーバーライドされていない場合、toString() は文字列 "[オブジェクトタイプ]" を返します。ここで、type はオブジェクトのタイプです。

toString() を使用して各オブジェクトの型を取得できます。各オブジェクトを Object.prototype.toString() で検出できるようにするには、Function.prototype.call() または Function.prototype.apply() として呼び出し、チェックするオブジェクトを thisArg と呼ばれる最初の引数として渡す必要があります。使用方法は次のとおりです。

var toString = Object.prototype.toString;

toString.call(new Date); // [オブジェクト Date]
toString.call(new String); // [オブジェクト String]
toString.call(Math); // [オブジェクト Math]

//JavaScript 1.8.5以降
toString.call(undefined); // [オブジェクトは未定義]
toString.call(null); // [オブジェクト Null]

オブジェクトが配列であるかどうかを判別したい場合は、次のように使用できます。

arr = [] とします。
console.log(Object.prototype.toString.call(arr) === "[オブジェクト配列]"); // true

互換性は次のとおりです。

型

型の判定といえば、typeofメソッドを思い浮かべる人が多いかもしれません。ここでtypeofに関する内容を復習しておきましょう。

typeof 演算子は、評価されていないオペランドの型を示す文字列を返します。

console.log(typeof 42); // "数値"
console.log(typeof 'blubber'); // "文字列"
console.log(typeof true); // "ブール値"
console.log(typeof undeclaredVariable); // "未定義"

typeof の可能な戻り値は次のとおりです。

上の図からわかるように、配列オブジェクトは「その他のオブジェクト」に属しているため、配列オブジェクトの typeof 戻り値は「オブジェクト」になります。

arr = [] とします。
console.log(typeof arr); // "オブジェクト"

したがって、typeof の使用は避けるべきです。

要約する

上記は、値が配列であるかどうかを判断するいくつかの方法です。もちろん、便利なものもあればそうでないものもありますが、いずれにしても、そのようなものがあることを知っておくのは常に良いことです。要約すると:

最適な方法は Array.isArray ですが、IE8 以下ではサポートされていません。
互換性が懸念される場合は、Object.prototype.toString を使用できます。

JavaScript を使用して配列かどうかを判断する方法についての記事はこれで終わりです。JavaScript を使用して配列かどうかを判断する方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: