こんにちは、てっちーです。先日、数値変換の記事を書きましたが関連してNaNの判定方法についても行ってみたいと思います。NaNは特殊なようで、すこしトラブルになる可能性がありそうなので調べてみました。
isNaN(値) は使わない方が良い？
isNaN関数はNaNの判定に使う関数です。これを使えば判定できるのですが注意点があります。それは”値”に入力されたものが、数値でない場合、数値への暗黙の変換が行われます。その結果、数値への変換ができないとNaNが返り、結果trueになってしまいます。いろいろなケースがありますが、ありがちな例で言うと文字列をいれるとtrueになっちゃいます。次の例を参考にしてみてください。
var tmp = parseInt("adfa"); // NaNを代入
console.log(isNaN(tmp)); // true
console.log(isNaN("abc")); // true
console.log(isNaN(123)); // false
これでは使えない場合があると思いますので、よくわからない場合は使わない方が無難です。
NaN!==NaN は true になる特性を使おう
上記のような問題が過去にはあったようで対策として次のようなものが使われています。その方法は、NaNだけが自分自身と一致比較をすると必ず不一致になる特性があるので、それを利用すると下記のように判定できます。
var tmp = parseInt("adfa"); // NaNを代入
console.log(tmp!==tmp); // 同じ変数を不一致比較でtrueになるNumber.isNaN()
ECMAScript（ES2015）ではNumber.isNaN()メソッドを使用することで、次のようにすることで判定ができます。自分自身を不一致判定する方法です。NaNの以外ものはすべてfalseになり、NaNであればtrueになるのでうまく判定できます。
var tmp = parseInt("adfa"); // NaNを代入
console.log(Number.isNaN(tmp)); // trueECMAScript
余談になりますが、ECMAScriptはご存知でしょうか。ECMAScriptとは、JavaScriptの準拠している言語仕様のことで国際的な活動として標準化手続きを行っている団体が策定しています。JavaScriptができた後、ライセンス問題でブラウザ毎の方言がいろいろあった時代に標準的な仕様を作ろうと始まったのがECMAScriptです。しかし、標準化もうまく進まず、すったもんだの不遇時代があった後、Google Mapでブレイクしてメジャー路線を歩み始めたそうです。ちなみにECMAScript(2015)は、第6版の仕様でECMAScript6やES6、ES2015と表現される場合もあります。2015年のバージョンなので最近のブラウザは対応済みですが、古いブラウザを使っている場合は動かない場合もある様です。ES2015を使う場合は注意した方がよさそうです。
まとめ
inNaN()関数は使わない方が無難
NaNの判定は自分自身を不一致判定することで判定できる。(NaN!=NaN)
ES2015を使える場合は、Number.isNaN()メソッドを使おう。
コメント