まくまくJavaScriptノート
配列内にある要素が存在するか調べる (includes, indexOf)
2020-04-09

配列内に特定の要素が存在するかを調べるには以下のような方法を使います。

  • Array クラスの includes() メソッドを使う方法(ECMAScript 2016 以降)
  • Array クラスの indexOf() メソッドを使う方法(昔からある方法)
  • jQuery の $.inArray() を使う方法

Array#includes を使う方法

ECMAScript 2016 移行では、Array#includes() メソッド を使うのが直感的でよいです。 指定した要素が配列内に含まれているとき、このメソッドは true を返します。

const arr = ['aaa', 'bbb', 'ccc', 'ddd'];
if (arr.includes('ccc')) {
    console.log('ccc が見つかりました');
}

Array#indexOf を使う方法

古くからある方法です。 Array#indexOf() メソッド は、指定した要素が配列内のどのインデックス位置に存在するかを調べることができます。 要素が存在しない場合は -1 を返すので、これを利用してある要素が配列内に存在するかを調べることができます。

const arr = ['aaa', 'bbb', 'ccc', 'ddd'];
if (arr.indexOf('ccc') != -1) {
    console.log('ccc が見つかりました');
}

jQuery の $.inArray を使う方法

おまけ。

const arr = ['aaa', 'bbb', 'ccc', 'ddd'];
if ($.inArray('ccc', arr)) {
    alert('ccc が見つかりました');
}
2020-04-09