😉

【JS】配列操作のまとめ②(some, every, includes)

2021/10/03に公開

これは何?

前回こちらの記事の続編として、some, every, includesの配列操作についてまとめていきます。

some()

第1引数の関数で指定された条件に、配列内の要素が1つでも当てはまるかどうかを判定する
*元々の配列の要素は変更されない。

返り値

  • 配列の要素が1つでも条件を満たしていればtrueを返し、そうでなければfalseを返す
const array = [1, 2, 3, 4, 5, 6];

// 配列の要素に3が含まれているか判定
const isThree = array.some((item) => item === 3);

// 配列の要素に10が含まれているか判定
const isTen = array.some((item) => item === 10);


console.log(isThree); // true
console.log(isTen); // false

どんな時に使う?

配列内の要素に、想定している条件が存在するかどうか判定したい時

every()

第1引数の関数で指定された条件に、配列内の全ての要素が当てはまるかどうかを判定する
*元々の配列の要素は変更されない。

返り値

  • 配列の要素が1つでも条件を満たしていればtrueを返し、そうでなければfalseを返す
const array = [1, 2, 3, 4, 5, 6];

// 配列の全て要素が6以下の数か判定
const lessSix = array.some((item) => item <= 6);

// 配列の全て要素が10以上の数か判定
const greaterTen = array.some((item) => item >= 10);


console.log(lessSix); // true
console.log(greaterTen); // false

どんな時に使う?

配列内の全ての要素が、想定している条件に当てはまるか判定したい時

includes()

特定の要素が配列に含まれているかどうかをtrue or falseで返す

*元々の配列の要素は変更されない。また、文字列に対してもincludesメソッドを使用できるが今回は配列に絞ったものになりますので割愛いたします。

返り値

  • 引数で指定した値が、配列内から見つかった場合はtrueを返し、見つからなかった場合はfalseを返す
const array = [1, 2, 3, 4];

const hasValue = array.includes(3);
const hasNotValue = array.includes(5);

console.log(hasValue); // true
console.log(hasNotValue); //false

どんな時に使う?

配列内の要素に、想定している値が含まれるか判定したい時

第2引数

第2引数を指定することで、検索を開始する位置を指定することができます

const array = [1, 2, 3, 4];

// arrayのインデックス番号`1`から開始する[2, 3, 4]の配列から探している
const hasValue = array.includes(3, 1);
// arrayのインデックス番号`2`から開始する[3, 4]の配列から探している
const hasNotValue = array.includes(1, 2); 

console.log(hasValue); // true
console.log(hasNotValue); //false

第2引数が配列の長さと同じか大きい場合は、falseを返す

const array = [1, 2, 3, 4];

console.log( array.includes(1, 4)); // false
console.log( array.includes(1, 10)); //false

まとめ

  • some()は、配列内の要素が1つでも条件に当てはまればtrueになる
  • every()は、配列内の全ての要素が条件に当てはまればtrueになる
  • includes()は、配列内に、指定した値が含まれればtrueになる
  • some, every, includesは配列の要素を変更するのではなく、配列の要素をチェックするメソッド

Discussion