JavaScriptで空配列を見分ける5つの方法と実用例

はじめに
空配列判定の基本
空配列判定方法5選
応用例とサンプルコード
注意点
カスタマイズ方法
まとめ

はじめに

この記事を読めば、JavaScriptで空配列を判定する方法を5つマスターすることができるようになります。

空配列判定の基本

JavaScriptで配列が空かどうかを判断する方法はいくつか存在します。

ここでは、そのうちの代表的な5つの方法を紹介します。

空配列判定方法5選

○方法1：lengthプロパティを利用する

配列の要素数を示すlengthプロパティを使って空配列を判定する方法です。

const array = [];
if (array.length === 0) {
  console.log("空の配列です");
}

○方法2：Array.isArray()関数を利用する

Array.isArray()関数を使ってオブジェクトが配列かどうかを判定し、さらにlengthプロパティで要素数を確認します。

const array = [];
if (Array.isArray(array) && array.length === 0) {
  console.log("空の配列です");
}

○方法3：配列の要素をforループでチェック

forループを使って配列の要素を1つずつチェックし、空配列かどうかを判断します。

ただし、この方法は処理速度が遅くなる場合があります。

const array = [];
let isEmpty = true;

for (let i = 0; i < array.length; i++) {
  if (array[i] !== undefined) {
    isEmpty = false;
    break;
  }
}

if (isEmpty) {
  console.log("空の配列です");
}

○方法4：配列の要素をforEachでチェック

forEachメソッドを使って配列の要素を1つずつチェックし、空配列かどうかを判断します。

ただし、この方法も処理速度が遅くなる場合があります。

const array = [];
let isEmpty = true;

array.forEach((element) => {
  if (element !== undefined) {
    isEmpty = false;
  }
});

if (isEmpty) {
  console.log("空の配列です");
}

○方法5：filter()メソッドを利用する

filter()メソッドを使って、空でない要素があるかどうかを判断します。

この方法は、他の要素を検索する際にも使用できます。

const array = [];
const nonEmptyElements = array.filter((element) => element !== undefined);

if (nonEmptyElements.length === 0) {
  console.log("空の配列です");
}

応用例とサンプルコード

○応用例1：空配列を除外して処理を行う

複数の配列がある場合に、空配列を除外して処理を行いたい場合があります。

下記のサンプルコードでは、空でない配列だけを抽出しています。

const arrays = [[], [1, 2, 3], [], [4, 5]];
const nonEmptyArrays = arrays.filter((array) => array.length !== 0);
console.log(nonEmptyArrays); // [[1, 2, 3], [4, 5]]

○応用例2：空配列がある場合にアラート表示

空配列がある場合にアラートを表示するサンプルコードです。

const arrays = [[], [1, 2, 3], [], [4, 5]];
const hasEmptyArray = arrays.some((array) => array.length === 0);

if (hasEmptyArray) {
  alert("空配列が含まれています");
}

○応用例3：空配列の要素を自動補完

空配列がある場合に、デフォルトの値で要素を自動補完するサンプルコードです。

const arrays = [[], [1, 2, 3], [], [4, 5]];
const defaultArray = [0, 0, 0];

const filledArrays = arrays.map((array) => {
  if (array.length === 0) {
    return defaultArray;
  } else {
    return array;
  }
});

console.log(filledArrays); // [[0, 0, 0], [1, 2, 3], [0, 0, 0], [4, 5]]

注意点

配列の要素にundefinedやnullが含まれる場合、空配列と判定されることがあります。
注意して判定方法を選んでください。
forループやforEachを使って要素をチェックする方法は、処理速度が遅くなる場合があります。
大きな配列に対して使用する際は、速度を考慮して別の方法を検討してください。

カスタマイズ方法

空配列判定の方法をカスタマイズすることで、さまざまな条件に応じて柔軟に対応することができます。

例えば、特定の要素が含まれる配列だけを対象にしたい場合、下記のようにカスタマイズできます。

const arrays = [[], [1, 2, 3], [], [4, 5]];
const targetElement = 3;
const arrayWithTarget = arrays.filter((array) => array.includes(targetElement));

console.log(arrayWithTarget); // [[1, 2, 3]]