Number.isNaN() vs isNaN(): TypeScriptでNaNを安全に判定
TypeScriptで値がNaNかどうかを確認する方法
Number.isNaN()関数を使う
Number.isNaN()関数は、引数がNaNかどうかを厳密に判断します。これは、ES6で導入された新しい関数であり、より安全で信頼性の高い方法です。
function isNaNDemo(value: any): boolean {
return Number.isNaN(value);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNDemo(num1)); // false
console.log(isNaNDemo(num2)); // true
console.log(isNaNDemo(str1)); // false
isNaN()関数は、引数が数値に変換できるかどうかを確認します。つまり、引数が数値以外の場合はtrueを返し、数値に変換できる場合はfalseを返します。ただし、この関数は引数を暗黙的に数値に変換してしまうため、誤った結果を返す可能性があります。
function isNaNLegacyDemo(value: any): boolean {
return isNaN(value);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNLegacyDemo(num1)); // false
console.log(isNaNLegacyDemo(num2)); // true
console.log(isNaNLegacyDemo(str1)); // true **誤った結果**
一般的には、Number.isNaN()関数を使うことをお勧めします。これは、より安全で信頼性の高い方法であり、誤った結果を返す可能性が低いためです。
NaNとは何ですか？
NaNは "Not a Number" の略で、数値として認識できない値を表します。例えば、以下の操作の結果はNaNになります。
- 0と0を割る
- 文字列を数値に変換しようとする
- Math.sqrt()などの数学関数に不正な引数を与える
TypeScriptで値がNaNかどうかを確認するには、主にNumber.isNaN()関数とisNaN()関数の2つの方法があります。より安全で信頼性の高い方法であるため、一般的にはNumber.isNaN()関数を使うことをお勧めします。
その他のリソース
function isNaNDemo(value: any): boolean {
if (typeof value !== "number") {
return false;
}
return Number.isNaN(value);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNDemo(num1)); // false
console.log(isNaNDemo(num2)); // true
console.log(isNaNDemo(str1)); // false
function isNaNLegacyDemo(value: any): boolean {
return isNaN(value);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNLegacyDemo(num1)); // false
console.log(isNaNLegacyDemo(num2)); // true
console.log(isNaNLegacyDemo(str1)); // true **誤った結果**
説明
isNaNDemo()関数とisNaNLegacyDemo()関数は、それぞれ引数がNaNかどうかを確認する関数です。isNaNDemo()関数は、まず引数が数値かどうかを確認します。数値以外の場合は、falseを返します。数値の場合は、Number.isNaN()関数を使ってNaNかどうかを厳密に判断します。isNaNLegacyDemo()関数は、引数を暗黙的に数値に変換しようとし、変換できる場合はfalseを返し、変換できない場合はtrueを返します。ただし、この関数は引数を暗黙的に数値に変換してしまうため、誤った結果を返す可能性があります。
実行結果
false
true
false
補足
- このサンプルコードは、あくまでも例示であり、実際の用途に合わせて変更する必要があります。
- TypeScriptには、NaN以外の値を確認するためのさまざまな関数があります。詳細は、TypeScriptのドキュメントを参照してください。
TypeScriptで値がNaNかどうかを確認するその他の方法
オブジェクトの型ガードを使う
TypeScript 4.1以降では、オブジェクトの型ガードを使用して、値がnumber型でかつNaNではないかどうかを確認することができます。
function isNumberAndNotNaN(value: any): value is number {
return typeof value === 'number' && !Number.isNaN(value);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNumberAndNotNaN(num1)); // true
console.log(isNumberAndNotNaN(num2)); // false
console.log(isNumberAndNotNaN(str1)); // false
ES2020のObject.is()関数を使う
ES2020で導入されたObject.is()関数は、2つの値が同じオブジェクトであるかどうかを厳密に比較します。これは、NaNかどうかを判断するのにも使用できます。
function isNaNDemo(value: any): boolean {
return Object.is(value, NaN);
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNDemo(num1)); // false
console.log(isNaNDemo(num2)); // true
console.log(isNaNDemo(str1)); // false
カスタム関数を使う
独自の関数を作成して、値がNaNかどうかを判断することもできます。この方法は、より柔軟な制御が必要な場合に役立ちます。
function isNaNDemo(value: any): boolean {
if (typeof value !== 'number') {
return false;
}
return value !== value; // NaNは自分自身と等しくない
}
const num1 = 10;
const num2 = NaN;
const str1 = "文字列";
console.log(isNaNDemo(num1)); // false
console.log(isNaNDemo(num2)); // true
console.log(isNaNDemo(str1)); // false
- シンプルで安全な方法が必要な場合は、Number.isNaN()関数を使用するのがおすすめです。
- オブジェクトの型ガードを使用する場合は、TypeScript 4.1以降を使用する必要があります。
- Object.is()関数は、より厳密な比較が必要な場合に役立ちます。
- カスタム関数は、より柔軟な制御が必要な場合に役立ちます。
typescript
