今回取り上げるのは、JavaScriptの中で、引数に無名関数を使ったコールバック（関数）を利用して配列を操作する主なメソッドです。
- some
- 概要 : 配列の少なくとも1つの要素が、無名関数を使ったコールバック（関数）でTRUEになるかチェック
- 戻り値 : TRUE or FALSE（パスしたやつがある時点で
TRUEを返す） - 構文 :
array.some(callback)- callback: 個々の要素を判定するための関数
- every
- 概要 : 配列の全要素が、無名関数を使ったコールバック（関数）によるチェック
- 戻り値 : TRUE or FALSE（パスしなかったやつがある時点で
FALSEを返す） - 構文 :
array.every(callback)- callback: 全要素を判定するための関数
- find
- 概要 : 配列の要素1つ1つを、無名関数を使ったコールバック（関数）で評価して、trueになった最初の要素の値を返す
- 戻り値 : trueとなった要素の値
- 構文 :
array.find(callback)- callback: 個々の要素を判定するための関数
- forEach
- 概要 : 配列中のそれぞれの要素に対して無名関数を使ったコールバック（関数）を実行する
- 戻り値 : なし
- 構文 :
array.forEach(callback)- callback: 個々の要素を処理するための関数
- map
- 概要 : 上のforEachと同じく、配列の要素1つ1つに、第一引数に指定した無名関数を使ったコールバック（関数）を実行する
- 戻り値 : 要素1つ1つ処理したあとの配列
- 構文 :
array.map(callback)- callback: 個々の要素を判定するための関数
- filter
- 概要 : 上のmapと同じく、配列の要素1つ1つに、第一引数に指定した無名関数を使ったコールバック（関数）を実行する
（コールバック関数はboolean値を返す） - 戻り値 : trueとなった要素からなる配列
- 構文 :
array.filter(callback)- callback: 個々の要素を判定するための関数
- 概要 : 上のmapと同じく、配列の要素1つ1つに、第一引数に指定した無名関数を使ったコールバック（関数）を実行する
- reduce
- 概要 : 配列の隣接する2つの要素を左から右に指定した関数で計算して、1つの値を返すメソッド
- 戻り値 : 1つの値
- 構文 :
array.reduce(callback)- callback: 個々の要素を処理するための関数
主なメソッドの説明（簡易版）
| メソッド | 概要 | 戻り値 |
|---|---|---|
| some | 配列の少なくとも1つの要素がTRUEかチェック | Boolean |
| every | 配列の全要素がTRUEかチェック | Boolean |
| forEach | 配列の要素1つ1つに、第一引数に指定したコールバック関数を実行 | なし |
| map | 配列の要素1つ1つに、第一引数に指定したコールバック関数を実行 | 配列 |
| filter | 配列の要素1つ1つに、第一引数に指定したコールバック関数を実行 | 配列 |
| find | 配列の要素を一つずつ指定した関数で評価して、最初にtrueになった要素の値を返すやつ | trueとなった要素の値 |
| reduce | 配列の隣接する2つの要素を左から右に指定した関数で計算 | 値 |
個々の詳細を見ていきます。
some
概要 : 配列の少なくとも1つの要素が、無名関数を使ったコールバック（関数）でTRUEになるかチェック
戻り値 : TRUE or FALSE（パスしたやつがある時点でTRUEを返す）
コールバック（関数）引数 : x
書き方
const ary = [1,2,3,4,5];
const result = ary.some(x => x == 5);
console.log(result); // => true
const ary = [1,2,3,4,5];
const result = ary.some(x => x == 6);
console.log(result); // => false
every
概要 : 配列の全要素が、無名関数を使ったコールバック（関数）によるチェックを通るか
戻り値 : TRUE or FALSE（パスしなかったやつがある時点でFALSEを返す）
コールバック（関数）引数 : x
書き方
const ary = [1,2,3,4,5];
const result = ary.every(x => x < 10);
console.log(result); // => true
const ary = [1,2,3,4,5];
const result = ary.every(x => x == 1);
console.log(result); // => false
find
概要 : 配列の要素1つ1つを、無名関数を使ったコールバック（関数）で評価して、trueになった最初の要素の値を返す
戻り値 : trueとなった要素の値
コールバック（関数）引数 : ↓の3つ
- 第一引数 value → 要素の値
- 第二引数 index → インデックス番号
- 第三引数 array → 元の配列
const ary = [1, 2, 3, 4, 5]
const result = ary.find((value, index, array) => value * 2 >= 10);
console.log(result); // => 5
書き方
forEach
概要 : 配列中のそれぞれの要素に対して無名関数を使ったコールバック（関数）を実行する
戻り値 : なし
コールバック（関数）引数 : ↓の3つ
- 第一引数 value → 要素の値
- 第二引数 index → インデックス番号
- 第三引数 array → 元の配列
書き方
const ary = [1, 2, 3, 4, 5]
ary.forEach((value, index, array) => {
console.log(`${value} : ${index} : ${array}`)
});
// "1 : 0 : 1,2,3,4,5"
// "2 : 1 : 1,2,3,4,5"
// "3 : 2 : 1,2,3,4,5"
// "4 : 3 : 1,2,3,4,5"
// "5 : 4 : 1,2,3,4,5"
map
概要 : 上のforEachと同じく、配列の要素1つ1つに、第一引数に指定した無名関数を使ったコールバック（関数）を実行する
戻り値 : 要素1つ1つ処理したあとの配列
コールバック（関数）引数 : x
書き方
const ary = [1,2,3,4,5]
const result = ary.map( x => x * x);
console.log(result);
// console => [1, 4, 9, 16, 25]
// process => [1*1, 2*2, 3*3, 4*4, 5*5]
filter
概要 : 上のmapと同じく、配列の要素1つ1つに、第一引数に指定した無名関数を使ったコールバック（関数）を実行する（コールバック関数はboolean値を返す）
戻り値 : trueとなった要素からなる配列
コールバック（関数）引数 : x
書き方
const ary = [1,2,3,4,5]
const result = ary.filter( x => x % 2 == 0);
console.log(result);
// [3, 4, 5]
const ary = [1,2,3,4,5]
const result = ary.filter( x => x >= 2);
console.log(result);
// [2, 3, 4, 5]
reduce
-
概要 : 配列の隣接する2つの要素を左から右に指定した関数で計算して、1つの値を返すメソッド
-
戻り値 : 1つの値
コールバック（関数）引数 : ↓の4つ -
第一引数 value → 処理される要素
-
第二引数 value → 次に処理される要素
-
第三引数 index → インデックス番号
書き方
const ary = [1,2,3,4,5]
const result = ary.reduce( (x,y) => x+ y );
console.log(result);
// console => 15
// process => 1 + 2 + 3 + 4 + 5
const ary = [1,2,3,4,5]
const result = ary.reduce( (x,y,z) => x + y + z );
console.log(result);
// console => 25
// process => 1 + 2 + 3 + 4 + 5 + 0 + 1 + 2 + 3 + 4