• HOME > 
  • Javascript > 
  • jQueryのinArray()で配列内を検索する方法【要素...

jQueryのinArray()で配列内を検索する方法【要素が含まれているかチェック】

投稿日:

inArray()メソッドとは?

jQueryのinArrayメソッドは、配列の中に特定の要素が含まれているかどうかを検索することができるメソッドです。

条件分岐に利用することで、指定の要素が含まれている時といない時とで処理を分けることが可能になります。

inArrayメソッドは次のように記述します。

inArrayメソッドの書き方

inArrayの返り値

inArrayは検索した結果の返り値として、文字列が含まれていなかった時には「-1」を、含まれていた場合は対象のテキストの先頭を0として何文字目からはじまるかというインデックス番号を返します。

返り値
含まれているとき先頭を0としたインデックス番号
含まれていないとき-1

次の例では果物の名前が格納された配列の中から、「いちご」と「レモン」をそれぞれ検索しています。

先頭から検索を開始し「いちご」を見つけたらインデックス番号(先頭の要素を0番目とする)を返すので、返り値は「1」になります。

配列の中に「レモン」は存在しないので「-1」を返します。

jQuery

/*検索対象の配列↓*/
var targetA = ["リンゴ","いちご","バナナ","すいか","メロン","リンゴ","いちご","みかん"];
/*含まれている場合*/
console.log($.inArray("いちご",targetA));//返り値は1
/*含まれていない場合*/
console.log($.inArray("レモン",targetA));//返り値は-1

inArrayはヒットしたら検索を終了する

上記の例で、配列内に「いちご」は2つ存在しますがinArrayはひとつヒットしたら検索を終了するため、配列内に何個存在するかというチェックはできません

配列内で特定の要素の総数を調べたいときはeachメソッドなどと組み合わせたループをつくって処理する必要があります。

検索対象を何番目以降という形で指定する

先程の例では配列の先頭からすべてを検索対象としていましたが、次のように何番目以降から検索を開始するように指定することも可能です。

inArrayメソッドの書き方

次の例では、配列の3番目以降で検索を行うため、返り値は6になります。(返り値のインデックス番号は先頭から数えたものになります。)

jQuery

/*検索対象の配列↓*/
var targetA = ["リンゴ","いちご","バナナ","すいか","メロン","リンゴ","いちご","みかん"];
/*3番目以降で検索*/
console.log($.inArray("いちご",targetA,3));//返り値は6
リンク先のサムネイル
JavascriptのindexOfで文字列を検索する方法【lastIndexOfも】

indexOfメソッドを使用すると、テキストや配列の中に指定の文字列が含まれているかどうかを検索することができます。条件分岐に利用することで、ある文字が含まれている時といない時とで処理を分けることが可能になります...【もっと読む】

まとめ

以上がinArray()で配列内を検索するして特定の要素が含まれているかチェックする方法です。

関連する記事

サムネイル

jQueryのblurでフォーカスが外れた時の処理を行う方法……

2023年05月01日
最終更新日:2023年05月31日
jQueryのblur()メソッドはフォームの入力ボックスなどでフォーカスが外れたときに処理を実行させることができるメソッドです。
サムネイル

JavascriptのindexOfで文字列を検索する方法【……

2023年05月01日
最終更新日:2023年05月31日
indexOfメソッドを使用すると、テキストや配列の中に指定の文字列が含まれているかどうかを検索することができます。条件分岐に利用することで、ある文字が含まれている時といない時とで処理を分けることが可能になります。
サムネイル

jQueryのclosest()で最も近い親要素を取得する方……

2023年05月01日
最終更新日:2023年04月17日
jQueryのclosest()は、要素から最も近い親要素を取得(指定)できるメソッドです。要素の親要素を辿っていき、該当するセレクターを持つものを見つけ出してくれます。
サムネイル

jQueryのprop()メソッドで属性値を取得・設定する方……

2023年04月04日
prop()は要素の属性値を取得したり、追加・変更することができるメソッドです。attrメソッドとの違いには「返り値が異なる」といった点があります。
サムネイル

jQueryでラジオボタンの値を取得や操作する方法【チェック……

2023年04月04日
jQueryを使えばHTMLのラジオボタンでユーザーが選択した(チェックされた)値を取得・操作することができます。propメソッドを使用して行います。
サムネイル

jQueryでaタグのhref(リンク先)を書き換える方法【……

2023年04月04日
最終更新日:2023年05月31日
aタグのhref(リンク先のURL)を書き換えたい場合は、attrメソッドを使用します。リンク先のURLの一部だけを書き換えたい時は、replaceメソッドで文字の置き換えを実行してからattrメソッドで書き換えるという方法になります。