JavaScriptのisNaN()とNumber.isNaN()の違いを理解しよう
生徒
「先生、JavaScriptで『数値じゃないかどうか』を調べる関数ってありますか?」
先生
「ありますよ!isNaN()という関数があり、さらにNumber.isNaN()という似た関数もあるんです。」
生徒
「えっ? 2つもあるんですか?どう違うんでしょうか?」
先生
「とても混乱しやすいところです。では、この2つの違いを丁寧に見ていきましょう。」
1. NaNとは何かを理解しよう
まず、NaN(Not a Number)とは、「数値ではない値」を表す特別な値です。たとえば、文字列を無理やり数値に変換しようとしたときなどに登場します。
console.log(0 / 0); // NaN
console.log(Number("abc")); // NaN
NaN
NaN
JavaScriptでは「NaN」も数値型(number型)に分類されますが、その値自体は「数値ではない」という非常に不思議な存在です。
しかも、NaN === NaNはfalseになります。これは、「NaNは自分自身とも等しくない」というルールがあるためです。
console.log(NaN === NaN);
false
つまり、「値がNaNかどうか」を判定するには、特別な方法が必要なのです。
2. isNaN()関数とは?
isNaN()関数は、与えられた値を一度「数値に変換」してから、その結果がNaNかどうかを判定します。
console.log(isNaN(NaN)); // true
console.log(isNaN("abc")); // true
console.log(isNaN(123)); // false
console.log(isNaN("123")); // false
true
true
false
false
ここで注目してほしいのは、"abc"のような文字列もtrueを返す点です。なぜなら、"abc"を数値に変換するとNaNになるからです。
つまり、isNaN()は内部で暗黙的な型変換を行います。そのため、「見た目は文字列でも数値に変換できる場合(例:'123')」はfalseになり、「変換できない場合(例:'abc')」はtrueになります。
3. Number.isNaN()関数とは?
Number.isNaN()は、ES6(ECMAScript 2015)で追加された新しい判定方法です。こちらは、型変換を一切行わず、本当に値そのものがNaNであるかどうかだけをチェックします。
console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN("abc")); // false
console.log(Number.isNaN(123)); // false
console.log(Number.isNaN("123")); // false
true
false
false
false
先ほどと違って、"abc"などの文字列はfalseになります。なぜなら、"abc"はNaNという値そのものではないからです。
このように、Number.isNaN()は「厳密なNaN判定」を行うため、安全で信頼性が高い方法です。
4. isNaN()とNumber.isNaN()の違いを比較してみよう
2つの関数を並べて比較すると、違いが一目でわかります。
| 入力値 | isNaN() | Number.isNaN() |
|---|---|---|
NaN | true | true |
"abc" | true | false |
"123" | false | false |
123 | false | false |
undefined | true | false |
{} | true | false |
isNaN()は型変換を行うため、予想外のtrueが返ることがあります。一方、Number.isNaN()は変換をしないため、意図したとおりの結果になります。
5. 実際の使い方:数値チェックの例
たとえば、ユーザーが入力した値が「数値かどうか」を調べたいときに、この違いが大きく影響します。
let input = "abc";
if (isNaN(input)) {
console.log("数値ではありません。");
}
数値ではありません。
このように、isNaN()でも文字列を弾くことができます。しかし、場合によっては"123"のような文字列も「数値として扱える」ので、注意が必要です。
より安全に判定したい場合は、まず数値に変換してからNumber.isNaN()でチェックする方法がおすすめです。
let input = "abc";
let value = Number(input);
if (Number.isNaN(value)) {
console.log("数値変換できません。");
}
数値変換できません。
このように、Number.isNaN()は「変換後にNaNになるケース」を明確に判定できます。
6. どちらを使うべき?初心者へのおすすめ
結論として、基本的にはNumber.isNaN()を使うのがおすすめです。なぜなら、isNaN()は内部で自動的に型変換を行うため、思わぬ結果になることがあるからです。
一方、isNaN()は古くからある関数なので、古いコードではよく見かけます。既存のプログラムを読むときには、両者の違いを理解しておくと安心です。
もしあなたがこれから新しいコードを書くなら、次のように考えておきましょう。
isNaN()… 古いコードで使われている可能性あり(型変換あり)Number.isNaN()… 新しい書き方、厳密で安全(型変換なし)
この違いを理解しておくことで、将来のエラーを防ぐことができます。