小ネタ。
JavaScript(ECMAScript)、TypeScriptで文字列型(String型)から数値型(number型)に変換しようとしましたが、小数点セパレータが国によって違うため、微妙にハマったのでメモします。
なお、きれいな処理だとは思っていないので、もしよりよい表現があれば教えていただきたいです。
環境
- Node.js
- v14.17.6
ゴール
- 文字列から数値に変換する
- 文字列「-123,456,789円」を数値の「-123456789」に変換する
- 日本のセパレータに合わせる
今回ハマったのが、カンマで3桁ごとに区切られた文字列を数値変換できなかったのがきっかけです。
ですので、上記の変換ができればゴールとします。
要約
- 小数点セパレータ以外のセパレータを削除する
- paserFloatで文字列から数値型に変換する
手順
小数点セパレータ以外のセパレータを削除する
参考情報によると、国によって桁の区切る文字と小数を区切る文字が異なります。
今回の記事では、日本に合わせて「1,234,567.89」という文字列があった時に、小数点を意味するピリオドを小数点セパレータ
、ピリオドとカンマの区切り文字を合わせてセパレータ
と表現しています。
今回はカンマを全部削除したいので、次の正規表現で変換します。
"-123,456,789円".replace(/,/g, "") // -123456789円
文字列を数値に変換する
parseFloat
を使用することで数値に変換できます。
parseFloat("-123456789円") // -123456789
備考
そのほかの変換の検証結果
Number
で変換することもできますが、変換不可能な文字列が入るとNaN
に変換されます。「円」や「ドル」を変換できないのはわかりやすいですが、カンマもNaN
に変換されてしまいます。
また、NaN
で変換した方が後続の処理が動かなくて安全ですが、セパレータがカンマかそうでないかは国(ロケール)の問題だと思いますので、今回はNumber
を使用しない方式を採用しています。
Number(-123,45) // NaN
parseInt
は整数部のみを取得します。間違いなく整数しか扱わないという場合であればparseInt
でよいですが、こだわりがなければparseFloat
を使った方がよいと思われます。
parseInt(-123.45) // -123
parseInt
とparseFloat
は文字列の最初にヒットした数値部分を取得します。数値と文字列が今後に存在する文字列を入力する場合は注意してください。
parseFloat("12.3円45,6ドル789円") // 12.3
数値から文字列に変換する
数値から文字列にする場合は、String
で囲むだけで変換できます。
String(-123456789)
ソースコード
Jestで挙動をテストしています。
終わりに
数値から文字列の変換はString
で変換できるので、同様にNumber
でやるのが簡単だと思っていましたが痛い目にあいました。まさか、カンマが文字列として扱われるとは…。
気付いてみれば、3桁区切りの数値は表示上の問題でしかないので、文字列フォーマットではあるのですが…。気付くまでにかなり時間がかかってしまいました。
今後もこういう細かい仕様は頭の片隅に入れておきたいです。
この記事がお役に立ちましたら、各種SNSでのシェアや、今後も情報発信しますのでフォローよろしくお願いします。
参考情報