Unaryデコレータを使って、map(parseInt)を期待通りに返す

今回はmap関数を利用した際にしばしば起きる問題についての対応を。

上記のように、

['1', '2', '3'].map(parseFloat)

は[1, 2, 3]という配列を返しているのに対して、

['1', '2', '3'].map(parseInt)

は[1, NaN, Nan]という配列を返してしまいます。

これは、Array.prototype.map()は下記のような引数を取り、

• callback
  • currentValue
    The current element being processed in the array.
  • index
    The index of the current element being processed in the array.
  • array
    The array map was called upon.
• thisArg Optional. Value to use as this when executing callback.

また、parseIntが第二引数にradixをとる関数なので、
今回の場合、mapのコールバックで渡されるindexをradixとして、parseIntに渡しているために
paraseIntは数値に変換することができずNaNを返したわけです。

Unary

今回はUnary関数を作成して、['1', '2', '3'].map(parseInt)の返り値を[1, 2, 3]にするようにします。
Unary関数は関数の引数をひとつだけ取るように変更するためのデコレーターです。

const unary = (fn) => 
  fn.length === 1 
    ? fn
    : function (something) {
      return fn.call(this, something);
    }

この関数を使うことで期待通りの配列が返ってきました。
直感的にかけるので、この書き方を気に入っています。

参考

• parseInt
• parseFloat