isNaN関数

広告

対象の値がNaNかどうかを調べるにはisNaN関数を使います。 

isNaN(val)

値がNaNかどうかを調べます。

パラメータ:
  val  対象の値
戻り値：
  対象の値がNaNならtrue, それ以外ならfalse

「等価演算子」で記述した通り、「===」演算子や「==」演算子ではどちらかの値がNaNの場合は常にfalseを返すため等価演算子を使ってNaNかどうか調べることはできません。isNaN関数を使用することで対象の値または式がNaNかどうか調べることができます。 

var val = ...;

if (isNaN(val)){
  ...
}

では対象の値毎にどのような値を返すのかを確認していきます。

NaNについてはtrueを返します。数値やInfinityについてはfalseを返します。 

isNaN(NaN)       -->  true
isNaN(10)        -->  false
isNaN(Infinity)  -->  false

nullは数値に変換すると0となるのでfalseです。undefinedは数値に変換するとNaNとなるのでtrueです。 

isNaN(null)      -->  false
isNaN(undefined) -->  true

文字列の場合、数字の文字で構成される文字列はfalseですが、それ以外の文字列はtrueです。なおisNaN(parseInt("10yen"))はfalseですが、isNaN("10yen")はtrueです。 

isNaN("20")      -->  false
isNaN("20yen")   -->  true

論理値のtrue及びfalseは数値に変換すると1と0に変換されるので、どちらもfalseです。 

isNaN(true)      -->  false
isNaN(false)     -->  true

対象の値がオブジェクトの場合は、オブジェクト毎に異なります。 

isNaN([10, 9])        -->  true
isNaN(new Number(87)) -->  false
サンプルコード

では簡単なサンプルで試してみます。 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>JavaScript テスト</title>
</head>
<body>

<script type="text/javascript" src="./js/script3_1.js">
</script>

</body>
</html>

function nanCheck(val){
  if (isNaN(val)){
    document.write("○ " + val + "<br />");
  }else{
    document.write("× " + val + "<br />");
  }
}

document.write("<p>");
document.write("NaN?<br />");

nanCheck(10);
nanCheck(NaN);
nanCheck(Infinity);
nanCheck(null);
nanCheck(undefined);
nanCheck("39");
nanCheck("10nen");
nanCheck(parseInt("10nen"));
nanCheck(true);
nanCheck(false);
nanCheck([10, 9]);
nanCheck(new Number(87));

document.write("</p>");

上記を実際にブラウザ見てみると次のように表示されます。

p3-1

( Written by Tatsuo Ikura )