JavaScriptで数字を調べる方法

JavaScriptでは数字はプリミティブな型ですが、typeofを使っただけでは数字とNaNやInfinityを区別することはできません。

9月23日, 2019 – 6分読む

Photo by Alex Chambers on Unsplash

ある値がプリミティブな型であるnumberであるかどうかを確認する方法を知っておくと便利です。

JavaScriptは動的型付けされた言語なので、値がプリミティブ型のnumberであるかどうかをチェックする方法を知っておくと便利です。

数字を調べる最も簡単な方法は、typeof"number"NaNInfinity-Infinityを含みます。

私のコードのバグを示す、数字が別のタイプとして表示される可能性がある1つの例として、通貨の解析があります。

この場合、typeofstring」の値を取得したときに、文字列を数値に解析し忘れたことがわかりました。

div

Photo by Samuel Zeller on Unsplash

parseFloat()を使って通貨の値を確認した場合。

を使って通貨の値をチェックし、通貨記号を取り除くのを忘れてしまうと、パースに失敗し、奇妙な結果になります。

ああ、ダメですね。 この場合、typeofNaNの値は、JavaScriptでは数字とみなされるからです。

Photo by Gemma Evans on Unsplash

typeofキーワードが「number」を返す場合

numberプリミティブタイプをチェックするための明白な解決策は、 typeofキーワードを使用することです。 上で示したように。

しかし、typeofは、JavaScriptに2つの特別な値があるため、不完全な解決策となります。 NaN(”Not a Number”)とInfinityです。

私の通貨の例では、通貨の値が NaNInfinitytypeof"number" を返します。

おそらく、私の入力が通貨記号を使って書かれていて、その値を取り込むために単純に parseFloat()NaNとなります。

となります。

Photo by Timo Kaiser on Unsplash

A custom isNumber() function

Arobust, カスタムのisNumber()typeofNaNInfinityをチェックします。

あるいは。 NaNInfinitytypeof==="number"であることを確認するだけで十分だと思います。

div

Photo by 🇨🇭 Claudio Schwarz | @purzlbaum on Unsplash

The oneワンライナー

私はワンライナーが大好きです。 コメントで文書化する必要があると思いますが、派手なだけではなく、実は本当に便利なものだと思います。

ここでは、JavaScriptで数値をチェックする方法のワンライナーを紹介します。

しかし、JavaScriptで有限の数をチェックするには、もっと良い方法があります。ヘルパー関数のNumber.isFinite()isNumber()関数と同じ動作をします。 次のセクションで例を示します。

Photo by Bernard Hermant on Unsplash

最も簡単な数の確認方法。 しかし、JavaScriptの値であるInfinity-InfinityNaNがすべて数字のプリミティブ型であることを覚えておくのは有益な方法です。

Number.isFinite() メソッドは、渡された値が有限の数であるかどうかを判断します。” – MDN Docs

Number.isFinite()true を返します。

Infinity-InfinityNaN と、まさに欲しいものが返ってきます。

また、グローバルな isFinite() 関数もあり、上記のように型の強制(文字列を数字に強制するなど)を行います。

これらの方法については、「The Startup」のInfinityの記事で詳しく説明しています。

Photo by Bogomil Mihaylov on Unsplash

変数が整数であるかどうかの確認

変数Aが整数であるかどうかを確認するには、緩い等号演算子==を使って、解析された値が自分自身と等しいかどうかを確認することができました。

次のコードスニペットは、整数であるかどうかをチェックする方法の例を示しています。

typeof=== と同様に、数値に強制されている文字列と実際の数値を区別することができます。

div

Photo by Markus Spiske on Unsplash

通貨記号の除去

より良い、より堅牢な機能のために。

より良い、より堅牢な機能のために、最初に通貨記号(ドル記号やカンマなど)を除去したいと思うかもしれません。

JavaScriptの正規表現を使ってお金を完全に解析することはこの記事の範囲外ですが、このコードでは、解析の前に$,を削除しています。

なお、グローバル関数であるparseInt()parseFloat()NaNを返します。

また、Numbers.parseInt()Number.parseFloat()という関数もあり、全く同じ動作をします。

MDN Docsによると、これらの重複した関数はECMAScript 2015で「グローバルのモジュール化を目的」として追加されました。”

Photo by Toa Heftiba on Unsplash

JavaScriptは実際に整数を分けているのでしょうか?

いいえ、JavaScriptには1種類の数値しかなく、内部的には64ビットの浮動小数点で表現されています。

グローバル関数であるparseInt()parseFloat()は、期待するものと出力するものが異なりますが、実際にJavaScriptで整数型と浮動小数点型が別々に存在するからではありません。

Photo by Volkan Olmez on Unsplash

Conclusion

JavaScriptで数値をチェックすることは特に複雑ではありません – typeofNaNInfinitytypeofの数字を持っていることを認識していれば、基本的にはその通りに動作します。

有限の数をチェックする最も簡単な方法は(つまり NaNInfinityNumber.isFinite()isFinite()を使用することです。

具体的には、parseInt()===== (両方の値が数字の場合にのみ true を返します) を使用して、解析された値を自分自身と比較します。

裏を返せば、整数も浮動小数点も同じです。JavaScriptには、数値の種類は1つしかなく、数値プリミティブ型です。

Photo by K. Mitch Hodge on Unsplash. Mitch Hodge on Unsplash

Further reading

  • 関数 Number.isInteger() は文字列を数字にcoerceしない:
  • Sumit Kumar Pradhan氏は、Dev.C++で数字をチェックすることについて書いています。to:
  • Chris Ferdinandi氏がvanilla JSブログで数字の解析について議論しています:
  • 正規表現の^+(\.{1,2})?$はお金にマッチします:
  • Sarah Dayan氏がfrontstuffでJavaScriptでのお金の解析について書いています。

となっています。

Photo by Alejandro Ortiz on Unsplash

div

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です