関数型について勉強してみたらコードがシンプルになりました

こちらの記事を読ませていただき、とても勉強になったので実践した、というお話です。
忙しい人のためのjavascriptでざっくり理解する関数型

結果として、大変勉強になりました！ありがとうございます。

それでは、どんな風に修正したのか、前回書いた記事で使ったコードで比較してみます。

修正前のコード

function getMyQiita() {
  const token = "発行したアクセストークン";
  const uri = "http://qiita.com/api/v2/authenticated_user/items/";
  const options = {
    headers : {
      'Authorization' : 'Bearer ' + Token
    },
    method : 'get'
  }
  const res = JSON.parse(UrlFetchApp.fetch(uri, options));
  const id = res.map( function(report) {
    return report.id
  });
  const reports = id.map( function(id) {
    const uri = "http://qiita.com/api/v2/items/";
    return JSON.parse(UrlFetchApp.fetch(uri + id, options));
  });
  const report_array = reports.map( function(report) {
    return { "title" : report.title, "likes_count" : report.likes_count, "page_views_count" : report.page_views_count };
  });
  var msg = "";
  report_array.map( function(array) {
    msg += array.title.slice(0,30) + "\n / いいね : " + array.likes_count + " / view : " + array.page_views_count + "\n";
  });
  return msg;
}

完成したときは嬉しかったのですが、こうしてみると長いですし、何度も const 宣言してますしおすし。
だいたい、report_array ってなんだよ！(; ･`д･´)
変数名に苦心し過ぎだろ！
あー、恥ずかしい(*ﾉωﾉ)

それでは、勉強の成果をみてください。(=ﾟωﾟ)ﾉ

修正後のコード

function getMyQiita() {
  const token = "発行したアクセストークン";
  const uri = "http://qiita.com/api/v2/authenticated_user/items/";
  const options = {
    headers : { 'Authorization' : 'Bearer ' + token },
    method : 'get'
  }
  return JSON.parse(UrlFetchApp.fetch(uri, options))
  .map( function(report) { return report.id })
  .map( function(id) {
    const uri = "http://qiita.com/api/v2/items/";
    return JSON.parse(UrlFetchApp.fetch(uri + id, options));
  }).reduce( function(prev, report) {
    return prev + report.title.slice(0,30) + "\n / いいね : " + report.likes_count + " / view : " + report.page_views_count + "\n";
  },"");
}

変数の数があからさまに減りました。
const が 7個から 3個に。var はなくなりました。
まさに劇的ビフォーアフター。

凄く単純なことなんですが、map 関数って . で繋ぐことができるんですね。
「知らなかったの？」と言われそうで恥ずかしいのですが、この気づきで変数がほぼ不要になりました。

あと、配列を一文の string にするために msg という変数を用意して毎回追記していたのですが、reduce 関数を使ってこれも不要になりました。
reduce 関数は初めて知ったのですが、配列内の要素の値を１つにまとめてくれます。
初期値の設定もできるので、応用度が高いです。
色々なところで使っていけそうです。良いものを知りました。('◇')ゞ

おわりに

ここまでお付き合いいただきありがとうございました。
まずは動かすことが大事だから、自分のわかる範囲で作るのですが、新しい知識が手に入ると昔のも見直したくなりますね。
で、「ぎゃー！昔の自分はなんて稚拙なんだぁぁぁぁぁ(*ﾉωﾉ)」ってなるやつです。
子どものときの読書感想文みたいですね。

どーでもいい話ですが、うちの息子は夏休みの宿題の読書感想文がまだ終わっていません。
彼曰く、最高難易度の宿題なんだとか。
真面目に仕上げようと思っているだけでも偉いな、と思います。

ではまた！(^^)/

参考にさせていただきましたm(_ _)m

忙しい人のためのjavascriptでざっくり理解する関数型
reduce 関数