【jQuery】inArray()を使って配列の要素を検索する!

配列の要素を検索するにはjQueryのinArray()を使用します。

jQueryのinArray()とは配列内の要素を検索し、検索した要素のインデックスを返すメソッドになります。

また、検索したい値が配列内に複数見つかった場合は最初に見つけた値のインデックスを返すようになり、検索したい値が配列内に複数見つからなかった場合は-1を返します。

そして、inArray()メソッドは二次元配列や三次元配列のような多次元配列の中からでも値を検索することができます。

今回は、jQueryのinArray()を使って配列の要素を検索する方法について以下の内容で解説していきます。

⚫︎ 検索した要素が見つかった場合
⚫︎ 検索した要素が見つからなかった場合
⚫︎ 検索した要素が複数見つかった場合

⚫︎ 二次元配列の要素を検索する場合
⚫︎ 三次元配列の要素を検索する場合

ハルトさん

今回はjQueryのinArraty()で指定した要素で囲む方法について説明していきます。

さとみさん

お願いします!

inArray()とは

jQueryのinArray()とは配列内の要素を検索し、検索した要素のインデックスを返すメソッドになります。

inArray()の書き方

inArray()の書き方は下記となります。

inArrary()のパラメータ

⚫︎ 検索する値:
配列の中から検索したい値を指定する
⚫︎ 検索対象の配列:
検索する配列を指定する

inArray()のパラメータに検索する値と検索対象の配列を指定することで、検索対象の配列から検索する値を検索することができます。
検索する値が配列の中から見つかった場合はその値のインデックスを返し、見つからなかった場合は-1を返します。

配列の要素を検索するサンプルコード

配列の要素を検索するサンプルコードを紹介します。

検索した要素が見つかった場合

inArray()で検索した要素が見つかった場合を見てみます。

sample.html

index.js

出力結果

検索した要素が見つかった場合、inArray()メソッドは見つかった値のインデックスを返します。

検索した要素が見つからなかった場合

inAraay()で検索した要素が見つからなかった場合を見てみます。

sample.html

index.js

出力結果

検索した要素が見つからなかった場合、inArray()メソッドは-1を返します。

検索した要素が複数見つかった場合

inAraay()で検索した要素が複数見つかった場合を見てみます。

sample.html

index.js

出力結果

検索した要素が複数見つかった場合、inArray()メソッドは最初に見つかった値のインデックスを返します。

多次元配列の要素を検索するサンプルコード

多次元配列の要素を検索するサンプルコードを紹介します。

二次元配列の要素を検索する場合

二次元配列の要素を検索する場合を見てみます。
二次元配列の要素を検索するには、検索対象の配列にインデックスを1つ指定します。

sample.html

index.js

出力結果

検索対象の配列にインデックスを1つ指定することで二次元配列の要素を検索することができます。

さとみさん

検索対象の配列にインデックスを1つ指定することで二次元配列の要素を検索していますね!

ハルトさん

そうですね。
検索対象の配列の後ろのインデックスは配列の番号を表しています。
そのため、[0]の場合は[“イチゴ”, “バナナ”]の配列、[1]の場合は[“パイナップル”, “リンゴ”]の配列を表しています。

三次元配列の要素を検索する場合

三次元配列の要素を検索する場合を見てみます。
三次元配列の要素を検索するには、検索対象の配列にインデックスを2つ指定します。

sample.html

index.js

出力結果

検索対象の配列にインデックスを2つ指定することで三次元配列の要素を検索することができます。

さとみさん

検索対象の配列にインデックスを2つ指定することで二次元配列の要素を検索していますね!

ハルトさん

そうですね。
三次元配列の場合も同じで検索対象の配列の後ろのインデックスは配列の番号を表しています。
そのため、[0][1]の場合は[“イチゴ”, “バナナ”]の配列、[1][1]の場合は[“pine”, “apple”]の配列を表しています。

今回のポイント

inArray()で配列の要素を検索

⚫︎ inArray()メソッドのパラメータには検索したい値と検索対象の配列を指定する

⚫︎ inArray()メソッドで検索した要素が見つかった場合は検索した値のインデックスを返す

⚫︎ inArray()メソッドで検索した要素が見つからなかった場合は-1を返す

⚫︎ inArray()メソッドで検索した要素が複数見つかった場合は最初に見つかった値のインデックスを返す

⚫︎ 二次元配列の要素を検索するにはinArray()メソッドのパラメータである検索対象の配列にインデックスを1つ指定する

⚫︎ 三次元配列の要素を検索するにはinArray()メソッドのパラメータである検索対象の配列にインデックスを2つ指定する

Writer

Soshi

株式会社flyhawkのSoshiです。フライテックメディア事業部でのメディア運営・ライター業務なども担当。愛機はMac Book AirとThinkPad。好きな言語:swift、JS系(Node.js等)。好きなサーバー:AWS。受託開発やプログラミングスクールの運営をしております。ご気軽にお問い合わせください。

最新の案件情報