【Javascript】配列が空かどうかを判定する方法

今回の記事は、

  • Javascriptを使って、配列が空かどうかを判定したい

というお悩みを解消できる記事になっています。

Javascriptを使って配列が空かどうかを判定する際、その方法自体は非常にシンプルなのですが、「あれ、結局どれを使えばいいんだっけ?」と悩んでしまいがちですよね。

そんな方々に向けて、この記事では『Javascriptで配列が空かどうかを判定する方法』について解説していこうと思います。


レバテックフリーランス … 業界最大級の案件数業界トップクラスの高単価報酬を誇る最大手のサービスです。実績豊富なコーディネーターが丁寧な対応をしてくれるため、案件の無理な提案はありません。フリーランスで生きていくためにはまず登録しておきましょう。
MidWorks … フリーランス賠償責任保障生命保険の折半など、フリーランスでありながらも正社員並みの保障を受けられるのが特徴です。また、経験豊富なキャリアコンサルタントによる手厚いサポートも受けられるため、安定したフリーランス生活を送りたい方には特におすすめのサービスです。
ポテパンフリーランス … IT業界・技術に詳しいコンサルタントが担当してくれるため、こちらの要望をきちんと理解した上で案件を紹介してくれます。また、案件情報のみならず、フリーランスのイロハについても教えてくれるため、フリーランスとして初めて活動される方には特におすすめのサービスです。

レバテックキャリア … ITエンジニアが利用したい転職エージェントNo.1にも選ばれており、年収600万円以上のハイクラス求人を5,000件以上も保有しています。エンジニアが転職を考えた時にまず初めに登録しておくべきサービスです。
Tech Stars Agent … Tech Stars Agentでは、担当エージェントが全員エンジニア出身のため、スキルやキャリアを見据えたきめ細かな転職支援が受けられます。運営元の株式会社Branding Engineerは、独立支援サービス「MidWorks」も展開しているため、独立を視野に入れたサポートも受けられます
転職ドラフト … 年収UP率93.8%/平均年収UP額126万円と圧倒的な年収UP率を誇るイベント型のエンジニア向け 転職サービスです。毎月1回開催され、厳選された優良IT/Web系企業約150社からダイレクトスカウトを受け取ることができます。年収アップを目指す方は登録必須です。

配列が空かどうかを判定するためには?

Javascriptを使って配列が空かどうかを判定するためには、ズバリ、lengthメソッドを使用します。

ではまずは、このlengthメソッドの基本的な使い方から見ていきましょう。

lengthメソッドの基本的な使い方

lengthメソッドを使用すると、文字列の長さや配列の要素数を取得することができます。

その使い方は非常に簡単で、以下の通り使用します。

文字列の場合

const name = "タナカタロウ"

console.log(name.length)
=> 6

const name = "田中太郎"

console.log(name.length)
=> 4

配列の場合

const array1 = []

console.log(array1.length)
=> 0

const array2 = ["Ruby", "Rails", "Javascript"]

console.log(array2.length)
=> 3

このようにとても簡単で直感的に使えますよね。

lengthメソッドで配列が空かどうかを判定する方法

では実際にこのlengthメソッドを使って配列が空かどうかを判定する方法を解説していきます。

察しの良いかたはもうお気づきかもしれませんが、「配列が空」ということは、「配列の要素数がゼロ」ということになりますよね。

つまり、以下のようにして、「配列の要素数がゼロかどうか」を確認してあげましょう。

const array = []

if (array.length == 0) {
  console.log("空の配列です。")
} else {
  console.log("空の配列ではありません。")
}
=> 空の配列です。

このようにarray.length == 0を使用することで、配列が空かどうかを判定することができます。

また、array.length == 0を使う以外にも、以下の通り、様々な方法が存在しています。

// arrayが空配列でない場合の条件分岐
if (array[0]) { ... }
if (array.length > 0) {...}
if (array.length) { ... }

私個人的には、最後のarray.length 或いは !array.lengthを使って、空配列かどうかを確かめることが多いです。

// 空配列でない場合の処理
if (array.length) {
  ...
}

// 空配列の場合の処理
if (!array.length) {
  ...
} 

上記の通り、JavaScriptは0をfalseとして、1以上をtrueとして認識するためです。 他の言語では0もtrueとして認識することも散見されるのですが、この使い方はJavaScriptならではと言えますね。

配列が未定義の場合の判定方法

上述の通り、lengthメソッドを使用すれば、配列が空かどうかを簡単に判定することができるのですが、あくまでこれは、配列が定義されている場合の話です。

配列が定義されていない場合(undefinedの場合)にlengthメソッドを使用すると、Cannot read property 'length' of undefinedというエラーが発生してしまいます。

ただし、その解決策は簡単で、lengthメソッドを使用する前にその変数が定義されているかどうかを確認してあげましょう。具体的には以下の通りです。

if (typeof array === "undefined") {
  // 配列が未定義の場合の処理
} else if (array.length) {
  // 空配列でない場合の処理
} else {
  // 空配列の場合の処理
}

通常の実装をしている限り、配列が未定義ということはあまり見られることではありませんが、もしそのような場面に出くわした場合には、空配列かどうかを判定する前にそもそも配列が定義されているかどうかを確認してあげましょう。

お仕事の途中ですが、少し一休みして、転職独立について考えてみませんか🙌?

現役エンジニアが選ぶおすすめの転職エージェント11選【成功談・失敗談もあります】

レバテックフリーランスの評判ってどう?【現役エンジニアが徹底解説します】

MidWorks(ミッドワークス)の評判ってどう?【現役エンジニアが徹底解説します】

日々の業務に追われて自分を見失わないよう、
定期的にキャリアを振り返るようにしておきましょう🤲

最後に

さて、ここまで、Javascriptを使って配列が空かどうかを判定する方法をご紹介しましたがいかがでしたか?

今回ご紹介した方法はとてもシンプルで覚えやすいと思いますので、この機会にぜひ使いこなせるようになっておいてくださいね。

このブログを通じて少しでも「傍(はた)を楽(らく)にする」ことができていれば嬉しく思います。

最後まで読んで頂きありがとうございました。