.map .filter .reduce(24日目TIL)

「だんだん壁が見えてきて…」

高次関数の領域に入ります.JavaScriptは、関数を1つのオブジェクトとして扱い、パラメータとして関数を受信したり、関数から関数を返したりすることができます.変数に関数が含まれている場合は、変数をパラメータとして受信または返すこともできます.
このとき,パラメータ位置で関数をパラメータとして受け取る関数をcaller,パラメータに渡す関数をcallback関数と呼ぶ.callback関数は高次関数であってもよいし、そうでなくてもよいが、callback関数は高次関数であると理解できる.
タイトルに書いてある並べ方3種セット.map, .filter, .デフォルトでは、reduceはJavaScriptに組み込まれた高次関数です.mapメソッドは、配列内の要素を関数に挿入し、新しい要素に置き換え、新しい配列として出力します.filterは、関数によってフィルタされ、通過した要素のみからなる新しい配列を渡します.
.mapと.フィルターは難しくないけどreduceはよく知らないので、いくつかの困難に直面しました.だから今日.reduceをもっと集中させたい
開発学習では、まずmdnドキュメントを参照することに慣れています..reduce mdnドキュメントです.reduceメソッドについては、次のように説明します.
reduce()メソッドは、アレイ内の各要素に対して所与のreducer関数を実行し、結果値を返します.
まず理解しなければならないのは.reduceメソッドは結果値を返します.mapは、配列内のすべての要素を関数論理に対応するすべての新しい要素に変換します.filterが関数の論理に基づいて一致しない要素をフィルタリングし、残りの要素を返す場合.reduceは関数の要素を組み合わせて結果値を返します.
(もちろん、コードの実際の作成によっては、成果物が異なる場合があります.ここでは、基本関数の外観を説明するために簡潔に表現します.)
.reduceメソッドの基本形式は次のとおりです.

const array1 = [1, 2, 3, 4];
const reducer = function (acc, cur) {
  return acc + cur;
}

const result = array1.reduce(reducer, 0);
console.log(result);  // 10

この場合reduceはcallback関数と呼ぶことができます...reduceのカッコ内に直接関数を作成することもできますが、上記のように関数を個別の式としてロードすることもできます.
.reduce(reduce,0)の0はinitialValueです.reduceメソッドの実行時に提供されるaccの初期値.省略可能であるため,省略すると配列中の0番目の要素が1番目のaccとなる.
上記の段落は少し理解しにくいかもしれませんが、reduce関数のパラメータaccとcurを理解すると、initialValueが何を提供しているかがすぐにわかります.ではaccとcurは何ですか?accは.reduceメソッドの繰り返し実行時の以前の戻り値.curは、関数処理のために配列から取得された現在の要素値です.
reduceメソッドをより容易に理解するために,基本的に理解した重複文の外観を借りる.

const arr = [1, 2, 3, 4];
let result = 0;
for (let i = 0; i < arr.length; i++) {
	result = result + arr[i];
}

console.log(result);  // 10

.reduceのような重複文を作成しました.(実際、このように駆動するかどうかはわかりません^^;)
上記の繰り返し文は、配列内の要素をresultという変数に順番に追加します.reduceは重複割当ての部分を明確に示していないが,機能的には同じ結果値を示している.省略または非表示と理解できます.
繰り返し文のi++は配列内の要素と同じです.reduceでは、これも同様に省略されます.それでも.reduceが実行されると、実際には内部の要素が繰り返され、関数に基づいて結果が返されます.
ではaccは何curですか?指定者=右側のresultには、以前の重複文が返した結果が含まれます.arr[i]繰り返し文の進捗に応じて、配列には現在の進捗に必要な要素が含まれます.したがってaccはresult=result+arr[i];この場合、curをarr[i]と表し、分配者=右側の結果として表すことができる.

// acc == result
// cur == arr[i]
// .reduce == for 반복하며 결과를 result 에 할당
// result = 0 에서 0 == initialValue;

完全に一致しているとは言えないので、JavaScript式==演算子を使用してみましょう.reduceのコンセプトがよくわからないときは、上記のようにアプローチしてもいいので、ご理解いただけたらと思います.