LoginSignup
3
1

More than 3 years have passed since last update.

JavaScript: ["1", "2", "3"].map(parseInt) は正しく動かない

Posted at

JavaScriptで下記のようなコードを書いた際に下記のような結果になりました。

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

なんでこうなるのか

ドキュメントの トリッキーな使用例 に全く同じことが記載されていました。

parseIntには第二引数に基数を指定するオプションがあり、mapで繰り返し処理を行う際のindexが第二引数となっているため、上記の結果になります。
実際の挙動としては下記のようになっているとのこと。

// parseInt(string, radix) -> map(parseInt(value, index))
/*  first iteration  (index is 0): */ parseInt("1", 0)  // 1
/*  second iteration (index is 1): */ parseInt("2", 1)  // NaN
/*  third iteration  (index is 2): */ parseInt("3", 2)  // NaN

どうすれば良いのか

省略せずに下記のように書いておくのが安全です。
今回はparseIntがオプション引数を受け取るようになっていたということですが、念のため毎回このように書いておいた方が無難そう。

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

ついでにparseIntのドキュメントも確認

NaNが返される場合と第二引数が0の場合についての記載も解説にありました。

また、下記の場合は NaN が返されます。
radix が 2 よりも小さいか 36 よりも大きい、またはr
最初のホワイトスペース以外の文字が数値に変換できない。

radix が undefined, 0, または指定されなかった場合、 JavaScript 以下のように仮定します。
1. 入力した string が "0x" または "0X" (ゼロに続いて小文字または大文字の X) で始まった場合は、 radix は 16 と仮定され、残りの文字列が16進数として解釈されます。
2. 入力した string が "0" (ゼロ) で始まった場合は、 radix は 8 (8進数) または 10 (10進数) と仮定されます。厳密にどちらの基数が選択されるかは実装に依存します。 ECMAScript 5 では 10 (10進数) を使用するべきだと明示していますが、まだすべてのブラウザーが対応している訳ではありません。したがって、parseInt関数を使うときは radix を常に指定してください。
3. 入力した string がその他の値で始まるときは、基数は 10 (10進数) となります。

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1