スポンサーリンク

【GAS JavaScript】findIndexとindexOfの使い分け【配列の検索】

プログラミング

だいきです!

GASを使っていて取得してきたスプレッドシートの内容や入力したフォームのデータなど配列を扱うことはかなり多いと思います。
そんな中でも肝心なのはその取得してきたデータをどのように扱うかを考えなくてはいけません。

今回の記事では配列の中身を検索する際に使うfindIndexやindexOfの関数について取り上げていきたいと思います。

GASを使っている皆さんはもうすでにfindIndexやindexOfの関数を使いながら開発をしているかとは思いますが、どっちをどのように使い分けるのかについて理解できていない人も多いのではないでしょうか?

今回はこの二つの使い分け方について説明しておこうと思います。

GAS使ったことないよ!という方はこちらの記事を参考にしてみてください。

findIndexとindexOfの使い分け

それではfindIndexとindexOfとは、そもそもどういう関数なのかについて説明を先にして、そのあと両者のちがいについて説明していきます。

indexOf()とは?

indexofはStringの中身を検索するものArray(配列)の中身を検索するものの2種類あります。
今回はあくまでArrayの方になります。まあ使い方は同じなんですが…

引数に入れたものを配列の中にあるかどうか検索します。

使い方を以下で説明します。

array.indexOf('検索対象');
array.indexOf('検索対象', index);

見つからない場合は-1を返します。

一行目は基本的にarrayに入っている検索対象を探してきて配列の何番目にあるかを返す関数になります。

2行目は、“引数の2個目”に入っている配列番号から検索をはじめ、見つかった配列番号を返すことになります。

例えばこんな使用方法があるかと思います。

const color = 'red';
const colorArray = ['black','white','blue','red','yellow','red'];

//redの最初の位置を返す
let index = colorArray.indexOf(color);
//index = 3

//redの二個目の位置を返す
index = colorArray.indexOf(color,index + 1);
//index = 5

二個目の位置を返そうとしている方でやっていることは、一度最初のredの位置を把握して、その次のセルからまた検索をかけています。

最初の位置が分かっているなら二個目に来るものの位置も検索できますね!

ということは、これをForやWhileを使い繰り返すことすべての位置を割り出すこともできます。便利ですね!

findIndex()とは?

findIndexは配列の中から引数の中に指定した条件のものが配列の何番目にあるかを返します。

使い方を以下に記載します。

findIndexは配列の中身を一つずつ値に入れて確認しながら見つける方法になります。

array.findIndex(element => element == 1);
array   → 中身を検索したい配列

element → 配列の中身1つ分

もし見つからなかった場合は-1を返します。

let color = 'red';
const colorArray = ['black','white','blue','red','yellow','red'];

//要素がある場合
//colorと同じ要素を探し、配列番号を返す。
let index = colorArray.findIndex(element => element == color);
//index = 3


let result = colorArray[index];
//result = 'red'

//要素がない場合
color = 'green'
index = colorArray.findIndex(element => element == color);
//index = -1

result = colorArray[index];
//エラーになります。

findIndexは当てはまる条件を指定できるため、“オブジェクトの配列”で中身を確認しながら作成したいなどの時に使える関数ですね。

二つの違い

findIndexとindexOfの違いとは、やることの役割で変わってきます。

findIndexはどんな配列でも検索を行う際に条件を指定すること最初のどの位置にあるかを返してくれます。例えば、Objectの配列二次元配列などですね。

indexOfではまず書き方が楽ですね。変に条件を指定しなくてもいい。しかもStringでも使えるときてる。あとは検索開始番号を指定することができます

この違いを理解することで検索が容易にできるようになるのではないかと思います。

まとめ

今回は配列の中を検索する際によく使う関数について説明をしました。

これによってループ文なんかも書かずに検索をすることができます。

今回は二つの関数しか紹介しなかったですが、ほかにもsome()やlastIndexOf()など、検索する方法はたくさんあります。先人たちに感謝ですね。

lastIndexOf()後ろから検索を行っていく関数になりますのでこちらもぜひ使用してください。

リファレンスも以下に置いておきますのでよかったら参考にしてください。

indexOf JavaScriptリファレンス

String.prototype.indexOf() - JavaScript | MDN
indexOf() メソッドは、呼び出す String オブジェクト中で、 fromIndex から検索を始め、指定された値が最初に現れたインデックスを返します。値が見つからない場合は -1 を返します。

findIndex JavaScriptリファレンス

Array.prototype.findIndex() - JavaScript | MDN
findIndex() メソッドは、配列内の指定されたテスト関数に合格する最初の要素の位置を返します。テスト関数に合格する要素がない場合を含め、それ以外の場合は -1 を返します。

ほかにも記事をたくさん書いていきますので是非参考にしてください。よろしくお願いします。

コメント

  1. […] 【GAS JavaScript】findIndexとindexOfの使い分け【配列の検索】 […]

タイトルとURLをコピーしました