JavaScriptである値が配列に含まれるか調べる方法とコード例

配列にある値が含まれるか調べたい場合、JavaScriptでは色々方法があります。

例えばそのやり方の例をいくつか挙げるなら次の通り

  • 配列をループで回して値チェック
  • includesメソッドを使う
  • indexOfメソッドを使う

1番目のループで回して探すのはムダ処理が多すぎて論外ですね。

単純に「含まれるかどうか」を知りたいならincludesメソッド、値が含まれる「インデックス位置まで知りたい」ならindexOfメソッドを使うのが最適だと思います。

ここではこの2つのメソッドの使い方とコード例をまとめました。

1.includesメソッドの使い方とコード例

単純に値が含まれるか調べたいならincludesメソッドを使えばOK。これは配列にある値が含まれているかを true  または  false  の真偽値で返してくれるメソッドです。

次のようにある配列 arr  に対して呼び出し、第1引数に探したい値 searchValue  を、第2引数(任意)に検索を開始する位置 fromIndex  を渡して使います。

ちなみに2つめの引数については任意(オプショナル)なので渡さなくてもOK。単純に探したい値を渡せば含まれるかどうかがすぐに分かります。

 

例えば次が includes  で値を検索して結果をコンソール表示しているコード例

もう基本的な使い方については説明するまでもないくらい簡単です。

 

ちなみに includes  は先ほど書いたように2番目に検索を始めるインデックス位置も指定できます。

例えば次が開始位置も指定して値が含まれるか調べてコンソール表示しているコード例

インデックス位置なので0から始まることに注意してください。

 

ちなみにこのインデックス位置、マイナスの値も渡せます。

例えば配列 array  に対してマイナスのインデックス位置 index  を指定した場合だと、探索位置は 配列の要素数 - インデックス位置の絶対値 arr.length - Math.abs(index)  )になるという訳です。

そしてそのインデックス位置から末尾に向かって値の検索が開始されます。

上の説明だと分かりにくいと思うので、どういう動作をするかは次のコード例を見てください。

上コードだと配列の要素数は 6  です。

なのでincludesメソッドの2番目の引数に -3  を渡すと開始インデックスは 3 ( = 6 - 3  )から、2番目に -4  を渡すと開始インデックスは 2 ( = 6 - 4  )から始まるということ

もしマイナスの値を渡す場合は少し複雑な計算をしないといけないことに注意です。

 

以上がincludesメソッドを使った値が含まれるかのチェック方法

単純に「含まれているか」だけ調べたいなら処理速度的にも速いかもしれません。

2.indexOfメソッドの使い方とコード例

配列に値が含まれるか調べる方法の2つめはindexOfメソッドを使うこと

次のように配列 arr  に対して呼び出し、第1引数には検索したい値 searchValue  、第2引数(オプショナル)には検索インデックス位置 fromIndex  を渡して使います。

このメソッドの返り値は値が見つかれば最初に見つかったインデックスの位置を、もし見つからなければ -1  を返してきます。

なので -1  以外が返ってくれば値が含まれるということです。あと含まれるかだけでなく、最初に出てくる位置を調べるのにも役立ちますね。

 

例えば次が indexOf  で値の位置を調べてコンソール表示しているコード例

コードを見ればわかるように値が含まれるインデックス位置を返しているだけです。

ただし同じ値がある場合は最初の値の位置が返される点には注意

 

以上がindexOfメソッドで値が含まれるかチェックする方法

先ほど紹介したincludesメソッドと比べて値まで分かるというのが便利なところです。

ここまでのまとめ

紹介したメソッドをもう一度まとめると次の通り

  • includesメソッド
    探したい値と検索開始位置(任意)を渡して使う。返り値はその値が含まれていれば true  、含まれていなければ false  を返す
  • indexOfメソッド
    探したい値と検索開始位置(任意)を渡して使う。返り値は値が含まれる最初のインデックス位置、もし含まれていなければ -1  を返す

純粋に「含まれているか」調べたいときはincludesメソッド、「位置まで知りたい」というときはindexOfメソッドという風に使い分けすればいいと思います。

以上JavaScriptで配列に値が含まれるか調べる方法についてでした。

Commentsこの記事についたコメント

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください