関数式プログラミングVSコマンド式プログラミング

jsはES 6が登場するまでの開発モデルは基本的に命令式プログラミング(IP)モデルで開発されていましたが、ES 6が発表されて以来、jsの開発大神たちはPythonやRubyの開発モデルを真似て、関数式プログラミング(FP)モデルも流行してきました.reactを学んだことがある方はご存知でしょうか
命令式
配列のすべての要素を印刷するとします

const print = function(arr) {
    for(let i=0;i

かんすうしき
分割機能ぶんかつきのう:配列を反復し、各項目を印刷

const forEach = function (arr, act) {
    for(let i=0;i

両者の違い:

               、        
      ，             ；       ，        
                
      ，             ；      ，     、  、     
      ，                 ，           ，                ，                     

ES 2015+の関数式プログラミング進化
例:配列の最小値を特定する
コマンド:配列を反復し、現在の値が配列要素より大きいかどうかを確認します.

let findMin = function(arr) {
    let min = arr[0];
    for(let i=0;iarr[i]) {
            min = arr[i];
        }
    }
    retrun min;
}

関数式:Math.min関数と(...)拡張演算子

const min = function(arr) {
    return Math.min(...arr);
};

矢印関数の簡略化プロセス

const min = arr => Math.min(...arr);

map、filter、reduce——関数式プログラミング基礎ツールボックス
例:あるデータセットを別のセットに変換またはマッピングする
コマンド:

const dayOfWeek = [
  {name: "Monday", value: 1},
  {name: "Tuesday", value: 2},
  {name: "Wednesday", value: 3},
];
let dayOfWeekVal = [];
for(let i=0;i

ES2015+

cosnt dayOfWeekVal = dayOfWeek.map(day => day.value);

フィルタフィルタの追加
命令式

const poNum = function(arr) {
  let po = [];
  for(let i=0;i=0) {
      po.push(arr[i]);
    }
  }
  return po;
}

かんすうしき

const poNum = arr => arr.filter(num => (num>=0));

接合配列——reduceの使い方
命令式

const mergeArr = function(arrays) {
  let newArr = [];
  let k = 0;
  for(let i=0;i

かんすうしき

const mergeArr = function(arrays) {
  return arrays.reduce(
    function(p,n) {
      return p.concat(n);
    }
  );
};

シンかんすうしき

const mergeArr = (...arrays) => [].concat(...arrays);