Number.isFinite和isFinite与isNaN()和isNaN的区别

判断是否为数字(不够完美)

复制代码

function isNumber(value) {
    return typeof value === 'number' && !isNaN(value);
}
// 测试
isNumber(123);       // true
isNumber(0);         // true
isNumber(NaN);       // false （NaN 被排除）
isNumber(Infinity);  // true  （无穷大算数字）这里判断出错了
isNumber("123");     // false

判断是否为数字

复制代码

function isNumber(value) {
  return typeof value === 'number' && Number.isFinite(value);
}

这个办法虽然好，但有点累赘了。

因为你不清楚Number.isFinite的含义。

Number.isFinite

Number.isFinite(value) 是 ES6 引入的静态方法，

只有当 value 的类型为 "number"，且该数字不是 NaN，也不是 Infinity 或 -Infinity 时，才返回 true。

Number.isFinite(): 不会类型强制转换

isFinite()会类型强制转换。

isFinite

先将value强制转换为数字"number"，且该数字不是 NaN，也不是 Infinity 或 -Infinity 时，才返回 true。

isFinite()和Number.isFinite()的区别

isFinite()会进行强制类型转换，而Number.isFinite()不会进行类型转换。

Number.isFinite()和isFinite()的详细示例对比

复制代码

// ✅ 对于真正的有限数字，两者返回一致
Number.isFinite(123);        // true
isFinite(123);               // true

// 对于非有限数字（NaN / Infinity）
Number.isFinite(NaN);        // false
isFinite(NaN);               // false

Number.isFinite(Infinity);   // false
isFinite(Infinity);          // false

Number.isFinite(undefined);  // false
isFinite(undefined);         // false （强制转化为数字,undefined -> NaN）

Number.isFinite("abc");      // false
isFinite("abc");             // false （强制转化为数字,"abc" -> NaN）

// ⚠️ 对于非数字类型,开始出现巨大分歧
Number.isFinite("123");      // false （因为类型是 string）
isFinite("123");             // true  （会进行强制转换,"123" --> 123）

// ⚠️ 对于"",开始出现巨大分歧
Number.isFinite("");         // false
isFinite("");                // true  （会进行强制转换，"" --> 0）

// ⚠️ 对于true,开始出现巨大分歧
Number.isFinite(true);       // false
isFinite(true);              // true  （会进行强制转换,true -> 1）

// ⚠️ 对于null,开始出现巨大分歧
Number.isFinite(null);       // false
isFinite(null);              // true  （会进行强制转换,null -> 0）

// ⚠️ 对于[],开始出现巨大分歧
Number.isFinite([]);         // false
isFinite([]);                // true  （强制转化为数字,[] -> "" -> 0）

// ⚠️ 对于数字类型的数组,开始出现巨大分歧
Number.isFinite([5]);        // false
isFinite([5]);               // true  （[5] -> "5" -> 5，有限）

什么推荐使用 Number.isFinite？

更安全：避免因隐式转换导致的逻辑漏洞。

兼容性：ES6出来的，主流浏览器支持，但是IE不支持

更加简洁判断是否是数字的办法(不支持IE)

看了上面的讲解，判断数字的最佳办法是这个；

复制代码

const isNumber = Number.isFinite(value)

兼容IE判断数字的方法

复制代码

function isNumber(value) {
  return typeof value === 'number' && isFinite(value);
}
console.log(isNumber(Infinity)); // false
console.log(isNumber(NaN)); // false
console.log(isNumber('1234')); // false

isFinite() IE 兼容性

isNaN(value)

先将参数 value 强制转换为数字(调用的是ToNumber),再判断转换后的结果是否为 NaN。

复制代码

isNaN("hello")    → true   （hello强制转化为数字NaN,返回true）。
isNaN("123abc");  → true  （Number("123abc") => NaN）
isNaN(undefined)  → true‌‌   (强制转化为数字NaN，因为Number(undefined)是NaN。所以返回true)
isNaN({});        → true  （Number({}) => NaN）

isNaN(123)        → false  （123 不是NaN，返回false）
isNaN("123")      → false （强制转化为数字123，123不是NaN，返回false）。
isNaN(null)       → false （强制转化为数字0,因为Number(null)是0。返回false）。‌‌
isNaN("");        → false （强制转化为数字0,因为Number("")是0，返回false）
isNaN("   ");     → false （强制转化为数字0,因为Number("   ")是0,返回false）
isNaN(false);     → false （Number(false),强制转化为数字0）
isNaN([]);        → false （Number([]),强制转化为数字0）

Number.isNaN(value)

不会对传入的参数value做类型转换。它只在 value 严格等于 NaN 时返回 true，其他所有情况都返回 false。

Number.isNaN() 和 isNaN()的区别

Number.isNaN()不会对传入的参数做类型转换。

isNaN()会对传入的参数做类型转换(强制转换为数字)。

复制代码

// 典型的陷阱对比
Number.isNaN("abc");   // false （不会转换，直接判定不是 NaN，返回false）
isNaN("abc");          // true  （强制转化为数字类型NaN，Number("abc") => NaN， 返回true）

Number.isNaN(undefined); // false （不会转换，直接判定不是 NaN，返回false）
isNaN(undefined);        // true（强制转化为数字类型NaN，Number(undefined) => NaN， 返回true）

number()几个常见的值转化

复制代码

Number("hello")    → NaN  
Number("123abc")   → NaN  
Number(undefined)  → NaN
Number({})         → NaN）
Number(null);      → 0
Number("");        → 0
Number("   ")      → 0
Number(false);     → 0
Number(true);      → 1
Number([]);        → 0
Number([5]);        → 5
Number([5, 6]);     → NaN