via「30秒で理解できるjavascriptが難しい・・・」

via 30秒で理解できるjavascriptが難しい・・・

• 30秒で理解できるjavascriptが難しい・・・ - masalibの日記

アロー関数で作られているのを見るのが苦手!!アロー関数じゃない形にして解析する事にしました

babel が吐き出したコードを見てうんざりした。

元のコードはこれ。

• GitHub - Chalarangelo/30-seconds-of-code: Curated collection of useful Javascript snippets that you can understand in 30 seconds or less.

const ary = (fn, n) => (...args) => fn(...args.slice(0, n));
const firstTwoMax = ary(Math.max, 2);
[[2, 6, 'a'], [8, 4, 6], [10]].map(x => firstTwoMax(...x)); // [6, 8, 10]

前提知識があまりない状態で元のコードを読む場合、... と .slice が何なのか分からないぐらい。そこを調べれば私でも読めた。 babel が吐き出したコードは、理解する気にならない (理解しなくていいという意味ではない)。昔の JavaScript がそういうコードだった。実際汚かったので、深く立ち入るのはいったん止めていた。

最近の JavaScript (ES6) は(以前に比べれば)本当によくなった。

あ、ary 関数がやっているのは「可変引数を取るある関数から引数の頭 n 個だけ処理する関数を作りだすこと」です。 上の例では Math.max は可変引数を取りますが、2引数だけを処理するバージョンの Math.max (つまり firstTwoMax) を作り出しています。