JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのArray.isArray()メソッドとは?オブジェクトが配列かどうかを判定する方法

JavaScriptのArray.isArray()メソッドは、指定したオブジェクトが配列であるかどうかを判定するためのメソッドです。

判定結果は真偽値として返され、配列であれば true、それ以外の場合は false を返します。typeof 演算子では配列も「object」と判定されてしまうため、正確に配列を見分けたい場面では Array.isArray() が最適な方法となります。

基本構文

Array.isArray(ob)

引数の ob には、判定対象となるオブジェクトを指定します。

サンプルコード①:ボタン操作で配列判定を行う

<!DOCTYPE html>
<html>
<body>
   <h2>ランキングポイント</h2>
   <p>これは配列でしょうか? 下のボタンをクリックすると答えが表示されます</p>
   <button onclick="display()">結果</button>
   <p id="test"></p>
   <script>
      var pointsArr = [10, 20, 30, 40, 50, 60, 70, 80, 90, 1000];
      var res = pointsArr.entries();
      for (val of res) {
         document.getElementById("test").innerHTML += val + "<br>";
      }
      function display() {
         var res = document.getElementById("test");
         res.innerHTML = Array.isArray(pointsArr);
      }
   </script>
</body>
</html>

実行結果

ページを開くと、entries() メソッドにより配列の各要素が「インデックスと値」のペアで一覧表示されます。

JavaScriptのArray.isArray()メソッドとは?オブジェクトが配列かどうかを判定する方法

上記の「結果」ボタンをクリックすると−

JavaScriptのArray.isArray()メソッドとは?オブジェクトが配列かどうかを判定する方法

pointsArr は数値の配列なので、画面には true と表示されます。

サンプルコード②:文字列の配列を判定する

<!DOCTYPE html>
<html>
<body>
   <h2>デモ</h2>
   <p>これは配列でしょうか?</p>
   <p id="test"></p>
   <script>
      var arr = ["Accessories", "Electronics", "Books", "Pet Supplies"];
      var res = document.getElementById("test");
      res.innerHTML = Array.isArray(arr);
   </script>
</body>
</html>

実行結果

JavaScriptのArray.isArray()メソッドとは?オブジェクトが配列かどうかを判定する方法

変数 arr は文字列を要素として持つ配列のため、こちらも true が出力されます。

まとめ

  • 配列であれば true、配列以外であれば false を返す
  • typeof 演算子や instanceof 演算子よりも確実に配列を判別できる
  • データ型チェックやバリデーション処理で活用できる

  1. 【初心者向け】JavaScriptのreverse()メソッドで配列を逆順にする方法

    JavaScriptのreverse()メソッドは、配列の要素を元の順序と逆順に入れ替えるための便利な関数です。このメソッドを呼び出すと、配列の最初の要素が最後に、最後の要素が最初に移動し、配列全体が反転されます。reverse()メソッドの基本reverse()は配列そのものを変更する「破壊的メソッド」である点に注意してください。つまり、元の配列の順序が直接書き換えられます。元の配列を保持したい場合は、あらかじめslice()やスプレッド構文([...arr])などでコピーを作成してからreverse()を使用するのがおすすめです。サンプルコード以下は、ボタンをクリックすると配列の要素が逆順

  2. JavaScriptにおける配列の分割代入(Destructuring)の基本と使い方

    分割代入(Destructuring)とは、配列から値を取り出して個別の変数に展開するための構文です。ES2015(ES6)で導入されたこの機能を使うと、配列の各要素を簡潔かつ読みやすく変数に割り当てることができます。 配列の分割代入のサンプルコード 以下は、JavaScriptで配列の分割代入を行うコード例です。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport&quo