JavaScript 判断字符串是否为数字的最佳方法

395 阅读1分钟

首先不说废话,直接把结论放出来,解析在下面:

结论:

方法 1:用 isNaNparseFloat 联手出击(最常用)

function isNumeric(value) {
  return !isNaN(parseFloat(value)) && !isNaN(value);
}

方法 2:用 isFiniteparseFloat 的黄金搭档

function isNumeric(value) {
  return !isNaN(parseFloat(value)) && isFinite(value);
}

方法 3:用正则表达式来一网打尽

function isNumeric(value) {
  return /^[+-]?\d+(\.\d+)?$/;
}

注意点

判断字符串是否 是一个数字,要注意问题的坑是isNaN("") === false,且Number("") === 0

解析

方法 1:用 isNaNparseFloat 联手出击

function isNumeric(value) {
  return !isNaN(parseFloat(value)) && !isNaN(value);
}
console.log(isNumeric("+123.12")); // true
console.log(isNumeric("123abc")); // false
console.log(isNumeric("")); // false
console.log(isNumeric(Infinity)); // true
  • parseFloat(value) 可以来排除空字符串的情况,因为parseFloat("")===NaN
  • isNaN(value) 判断是否是一个纯数字的字符串

方法 2:用 isFiniteparseFloat 的黄金搭档

接下来是 isFiniteparseFloat 这对黄金搭档。这个方法同样非常有效哦!

function isNumeric(value) {
  return !isNaN(parseFloat(value)) && isFinite(value);
}

console.log(isNumeric("-123.45")); // true
console.log(isNumeric("123abc")); // false
console.log(isNumeric("")); // false
console.log(isNumeric(Infinity)); // false
  • parseFloat(value) 依然负责排除空字符串的情况
  • isFinite 函数用来判断参数是否为一个有限数值。目的和 isNaN一样,判断是否是一个纯数字的字符串。
    • (isFinite方法1和2结果isFinite的结果是不一样哦,可自行选择)
  • 这个组合可以确保 value 是一个真正的数字,不是 Infinity 或者 NaN

方法 3:用正则表达式来一网打尽

最后一个方法,咱们来用正则表达式。虽然稍微复杂点,但它的准确性非常高哦!

function isNumeric(value) {
  return /^[+-]?\d+(\.\d+)?$/.test(value);
}

console.log(isNumeric("+123")); // true
console.log(isNumeric("-123.45")); // true
console.log(isNumeric("123abc")); // false
console.log(isNumeric("")); // false
  • 这个正则表达式 ^[+-]?\d+(\.\d+)?$ 看起来有点复杂,但它非常强大!
    • ^[+-]? 匹配可选的正负号。
    • \d+ 匹配一个或多个数字。
    • (\.\d+)? 匹配可选的小数部分。