JS判断数字的几种实用方法

最近发现不少小伙伴都对文章很感兴趣，所以今天继续给大家介绍文章相关的知识，本文《JS判断变量是否为数字的几种方法》主要内容涉及到等等知识点，希望能帮到你！当然如果阅读本文时存在不同想法，可以在评论中表达，但是请勿使用过激的措辞~

要判断一个变量是否为“真正的”数字，最稳妥的方法是结合 typeof 和 Number.isFinite()。1. typeof 只能判断基础类型，但会将 NaN 和 Infinity 识别为 "number"；2. Number.isNaN() 可精确判断是否为 NaN，避免全局 isNaN() 的类型转换问题；3. Number.isFinite() 能排除 NaN、Infinity 和 -Infinity，但会尝试转换非数字类型；4. 若要严格判断变量本身为有限数字，应使用 typeof value === 'number' && Number.isFinite(value)，此方法确保变量为 number 类型且为有效有限数值，是判断“真正数字”最可靠的方式。

在JavaScript里，要检查一个变量是不是数字，最直接也最常用的方法是结合 typeof 操作符和 Number.isNaN() 或 Number.isFinite()。光用 typeof 检查出 "number" 类型并不完全够，因为 NaN（Not-a-Number）和 Infinity 它们自己也是 number 类型。所以，更严谨的判断需要多加一层考量。

解决方案

判断一个变量是否为数字，我通常会根据具体需求选择不同的策略。

1. 基础判断：typeof 这是最基础的判断，它会告诉你变量的原始类型。

let a = 123;
let b = 'abc';
let c = NaN;
let d = Infinity;

console.log(typeof a); // "number"
console.log(typeof b); // "string"
console.log(typeof c); // "number"
console.log(typeof d); // "number"

你看，NaN 和 Infinity 也会被识别为 "number"，这在很多实际场景中是不够的，因为它们不是我们通常意义上的“可用于计算的数字”。

2. 排除 NaN：Number.isNaN() 当你想确认一个变量是数字，并且它不是 NaN 的时候，Number.isNaN() 就派上用场了。它比全局的 isNaN() 更可靠，因为它不会进行类型转换。

let num1 = 123;
let num2 = NaN;
let str = 'hello';

console.log(typeof num1 === 'number' && !Number.isNaN(num1)); // true
console.log(typeof num2 === 'number' && !Number.isNaN(num2)); // false (因为 num2 是 NaN)
console.log(typeof str === 'number' && !Number.isNaN(str));   // false (因为 str 不是 number 类型)

这个组合能很好地排除 NaN。

3. 排除 NaN 和 Infinity：Number.isFinite() 如果你的需求是判断一个变量是否为“有限的、真正的数字”（即非 NaN，非 Infinity，非 -Infinity），那么 Number.isFinite() 是最理想的选择。它隐式地包含了 typeof 的检查。

let val1 = 123;
let val2 = NaN;
let val3 = Infinity;
let val4 = -Infinity;
let val5 = 'hello';

console.log(Number.isFinite(val1)); // true
console.log(Number.isFinite(val2)); // false
console.log(Number.isFinite(val3)); // false
console.log(Number.isFinite(val4)); // false
console.log(Number.isFinite(val5)); // false (它会先尝试将非数字值转换为数字，转换失败则为 NaN，然后返回 false)

在我看来，Number.isFinite() 在大多数需要“有效数字”的场景下，都是最简洁和健壮的判断方式。

4. 判断是否为整数：Number.isInteger() 如果你只关心变量是不是一个整数，ES6 提供了 Number.isInteger()。

console.log(Number.isInteger(123));   // true
console.log(Number.isInteger(123.0)); // true
console.log(Number.isInteger(123.5)); // false
console.log(Number.isInteger(NaN));   // false
console.log(Number.isInteger(Infinity)); // false

这个方法同样自带了类型和有效性的检查。

为什么 typeof "number" 不够用？

这问题挺有意思的，也是很多初学者容易犯迷糊的地方。JavaScript 这门语言，在类型系统上有些自己的“脾气”。当你用 typeof 去检查一个变量时，如果它返回 "number"，这仅仅意味着这个变量在内部被标记为数字类型。但问题是，NaN（Not-a-Number）和 Infinity（无穷大）这两个特殊的值，它们在 JavaScript 的类型体系里，也被归类为 number 类型。

举个例子，你可能会做一些数学运算，结果却得到了 NaN，比如 0 / 0。或者 1 / 0 得到了 Infinity。这些结果，虽然从“类型”上看是数字，但在实际的业务逻辑中，它们往往代表着某种计算错误或者无效的状态，而不是一个可以继续参与计算的“有效数字”。所以，如果你只是简单地用 typeof x === 'number' 来判断，那么 NaN 和 Infinity 也会被误认为是有效数字，这可能会导致后续的逻辑出错，比如在渲染表格数据时显示 NaN，或者在计算总和时得到 Infinity。这显然不是我们想要的。所以，我们需要更细致的工具来区分这些“披着数字外衣的特殊值”。

Number.isNaN() 和全局 isNaN() 有什么不同？

这俩兄弟名字很像，功能也都是检查是不是 NaN，但它们的行为差异巨大，理解这一点非常重要，能帮你避开不少坑。

全局 isNaN()： 这个函数历史比较悠久，它的一个“特性”就是会先尝试把传入的参数转换成数字，然后再判断。如果转换失败，比如你传了一个字符串 'hello'，它会先尝试把 'hello' 转换成数字，结果就是 NaN，然后 isNaN(NaN) 自然就返回 true。

console.log(isNaN(NaN));      // true
console.log(isNaN(123));      // false
console.log(isNaN('123'));    // false (因为 '123' 可以被成功转换为数字 123)
console.log(isNaN('hello'));  // true  (因为 'hello' 无法转换为数字，结果是 NaN，所以返回 true)
console.log(isNaN(undefined)); // true (undefined 转换为 NaN)
console.log(isNaN(null));     // false (null 转换为 0)
console.log(isNaN({}));       // true  ({} 转换为 NaN)

看到没？isNaN('hello') 居然是 true！这在很多时候会让人非常困惑，因为它并不能严格地告诉你“这个变量是不是 NaN”，它告诉你的是“这个变量在尝试转换为数字后是不是 NaN”。这种隐式转换的行为，在需要严格类型检查的场景下，简直就是个灾难。

Number.isNaN()： 这是 ES6 引入的方法，它的设计目的就是为了解决全局 isNaN() 的痛点。Number.isNaN() 不会进行任何类型转换，它只会判断传入的值是否严格等于 NaN。只有当且仅当参数是真正的 NaN 值时，它才返回 true。

console.log(Number.isNaN(NaN));      // true
console.log(Number.isNaN(123));      // false
console.log(Number.isNaN('123'));    // false (不是严格的 NaN)
console.log(Number.isNaN('hello'));  // false (不是严格的 NaN)
console.log(Number.isNaN(undefined)); // false
console.log(Number.isNaN(null));     // false
console.log(Number.isNaN({}));       // false

显而易见，Number.isNaN() 的行为更符合我们直观的理解：我只想知道这个变量是不是那个特殊的 NaN 值，而不是它转换成数字后是不是 NaN。所以，在绝大多数需要判断 NaN 的场景下，都应该优先使用 Number.isNaN()。

如何判断一个变量是否是“真正的”数字，而不是特殊值？

当我们说“真正的”数字时，通常是指那些可以参与算术运算、有限的、非 NaN 的数值。前面提到 Number.isFinite() 就是为此而生。

Number.isFinite() 这个方法非常强大，它能帮你一次性排除掉 NaN、Infinity 和 -Infinity 这三种特殊情况。它的工作方式是：

1. 首先，它会检查传入的值是否是 number 类型。如果不是，它会尝试将其转换为数字。
2. 然后，它会判断这个数字是否是有限的。

这意味着，只有当一个值既是 number 类型，又不是 NaN，也不是 Infinity 或 -Infinity 时，Number.isFinite() 才会返回 true。

let validNum = 42;
let floatNum = 3.14;
let negativeNum = -100;
let notANum = NaN;
let positiveInf = Infinity;
let negativeInf = -Infinity;
let stringNum = '500';
let emptyString = '';
let booleanTrue = true;
let nullVal = null;

console.log(Number.isFinite(validNum));      // true
console.log(Number.isFinite(floatNum));     // true
console.log(Number.isFinite(negativeNum));  // true
console.log(Number.isFinite(notANum));      // false
console.log(Number.isFinite(positiveInf));  // false
console.log(Number.isFinite(negativeInf));  // false
console.log(Number.isFinite(stringNum));    // true (这里要注意，它会将 '500' 转换为 500，然后判断)
console.log(Number.isFinite(emptyString));  // true (空字符串转换为 0)
console.log(Number.isFinite(booleanTrue));  // true (true 转换为 1)
console.log(Number.isFinite(nullVal));      // true (null 转换为 0)

等等，你可能注意到 Number.isFinite('500') 竟然是 true？这和我们前面讨论的 Number.isNaN() 不进行类型转换有点不同。Number.isFinite() 在面对非数字类型时，会先尝试进行 ToNumber 转换。所以，如果你需要一个非常严格的判断，即变量本身就必须是 number 类型，并且是有限的，那么你可能需要结合 typeof：

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

console.log(isStrictlyFiniteNumber(42));       // true
console.log(isStrictlyFiniteNumber(NaN));      // false
console.log(isStrictlyFiniteNumber(Infinity)); // false
console.log(isStrictlyFiniteNumber('500'));    // false (因为 typeof '500' 是 "string")
console.log(isStrictlyFiniteNumber(true));     // false

这个 isStrictlyFiniteNumber 函数，在我看来，才是判断一个变量是否为“真正的、可用的数字”最稳妥、最符合直觉的方式。它既排除了 NaN 和 Infinity，也确保了变量本身的类型就是 number，而不是一个可以被转换为数字的字符串或其他类型。在很多数据校验和业务逻辑中，这种严格的判断是必不可少的。

文中关于typeof,NaN,Number.isNaN(),判断数字,Number.isFinite()的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《JS判断数字的几种实用方法》文章吧，也可关注golang学习网公众号了解相关技术文章。