JavaScriptのisNaN関数の使い方を現役エンジニアが解説【初心者向け】

初心者向けにJavaScriptのisNaN関数の使い方について解説しています。これは引数が非数を表すNaNであるかどうかを判定するものです。isNaNの基本の使い方、判定結果の見かたについてサンプルで確認しましょう。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

JavaScriptのisNaN関数の使い方について、TechAcademyのメンター(現役エンジニア)が実際のコードを使用して初心者向けに解説します。

そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まります。

 

なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。

 

田島悠介

今回は、JavaScriptに関する内容だね!

大石ゆかり

どういう内容でしょうか?

田島悠介

isNaN関数の使い方について詳しく説明していくね!

大石ゆかり

お願いします!

 

NaNとは

NaNとはNot-a-Numberの略称です。JavaScriptにおける非数(数字ではないもの)を表す、特別な値です。一般的には、数値を期待していたけど実は数値ではなかった場合の結果として使われることが多いです。

注意すべき点は、NaNとは先述した通り「値」ということです。なので、typeof演算子でNaNのデータ型を調べるとNumberと返ってきます。値は非数を表すものの、Infinityなどと同じようにNumber型に属している値だということになります。

 

isNaN関数とは

isNaN() 関数は引数が NaN (非数)かどうかを判定します。

 

[PR] JavaScript・jQueryで挫折しない学習方法を動画で公開中

isNaN関数の使い方

isNaN関数は「数値計算をした場合、NaNになり得る引数」を判定します。なので、未定義や文字列などを引数にした場合もisNaN関数はtrueを返します。

 

isNaN(0/0);
isNaN(NaN);
isNaN(undefined);
isNaN("ABCDE");

 

上記の判定結果はすべてtrueになります。

このようにisNaN関数は特殊な判定を行うので、「非数にならない値」と「それ以外」を判定する場合には使用できます。「値の中で非数かどうか」を判定する場合は、後述する「Number.isNaN()」メソッドを使用することが推奨されます。

 

Number.isNaNメソッドの使い方

先程使用した引数にNumberオブジェクトのisNanメソッドを使用してみます。

Number.isNaN(0/0);                //true
Number.isNaN(NaN);              //true
Number.isNaN(undefined);   //false
Number.isNaN("ABCDE");   //false

 

Number.isNaNを使用すると文字列や未定義などはfalseとして判定されるようになりました。

これは、Number.isNaNメソッドが「与えられた値がNaNであり、かつ、型がNumberである場合にtrueを返却する」という仕様だからです。

NaNの判定をする際にはより正確であるNumber.isNaNメソッドが広く使用されています。

 

監修してくれたメンター

水野大輝(みずのたいき)

2014年より、某物流会社のシステム開発担当として入社。

未経験ながら、社内システム保守~新規受注システム開発まで携わり、JavaScript Ruby on Rails PostgreSQLなどの経験を積む。

現在も、開発案件に携わりながら、日々勉強中。

 

大石ゆかり

内容分かりやすくて良かったです!

田島悠介

ゆかりちゃんも分からないことがあったら質問してね!

大石ゆかり

分かりました。ありがとうございます!

TechAcademyでは、初心者でも最短4週間でJavaScript・jQueryを使ったWebサービス公開を習得できるオンラインブートキャンプを開催しています。

また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。