检查变量是否包含Javascript中的数值？

Question

在PHP中，它非常简单：

is_numeric(23);//true
is_numeric("23");//true
is_numeric(23.5);//true
is_numeric(true);//false

但是我如何在Javascript中执行此操作？ 我可以使用正则表达式，但是有一个函数吗？

Answer 1

怎么样：

function isNumber(n){
    return typeof(n) != "boolean" && !isNaN(n);
}

isNaN内置函数用于检查某个值不是否为数字。

更新：Christoph是对的，在JavaScript中，布尔类型可转换为Number，返回1表示true，0表示false表示错误，因此如果评估1 + true，结果将为2。

考虑到这种行为，我更新了函数以防止将布尔值转换为其数字表示。

Answer 2

我认为到目前为止的任何建议都没有实际效果。例如

!isNaN(parseFloat(foo))

不会因为parseFloat()忽略尾随的非数字字符。

要解决此问题，您可以将返回值与演员通过Number()返回的值进行比较（或等效地使用一元+，但我更喜欢显式转换）：

parseFloat(foo) === Number(foo)

如果两个函数都返回NaN，因为NaN !== NaN为true，这仍然有用。

另一种可能性是首先转换为字符串，然后转换为数字，然后检查NaN，即

!isNaN(Number(String(foo)))

或等效，但不太可读（但很可能更快）

!isNaN(+('' + foo))

如果您想排除无穷大值，请使用isFinite()代替!isNaN()，即

isFinite(Number(String(foo)))

通过Number()显式投射实际上是不必要的，因为isNan()和isFinite()隐含地转换为数字 - 这就是为什么!isNaN()不起作用的原因！

在我看来，最合适的解决方案是

isFinite(String(foo))

---

正如Matthew所指出的，第二种方法不处理只包含正确空格的字符串。

修复起来并不难 - 使用Matthew评论中的代码或

isFinite(String(foo).trim() || NaN)

您必须确定这是否比比较parseFloat()和Number()的结果更好。

Answer 3

要检查javascript中的类型，您可以使用typeof运算符：

js> var x = 1;
js> typeof(x);
number

所以：

if (typeof(x) === 'number') {
   // Do something
}

如果要将变量的值强制转换为整数，可以使用parseInt(x, 10)将值解析为基数为10的整数。同样，如果需要，可以使用parseFloat浮点值。但是，无论类型如何，这些都将始终强制执行，因此传递null，true等将始终返回一个数字。但是，您可以通过调用isNaN来检查其是否为有效号码。

所以，把它们放在一起：

!isNaN(parseFloat(23)) // true
!isNaN(parseFloat('23')) // true
!isNaN(parseFloat(23.5)) // true
!isNaN(parseFloat(true)) // false

或

function isNumber(x) {
    return !isNaN(parseFloat(x));
}

Answer 4

检查数值，包括负数和浮点数。

function is_numeric(val){
    return val && /^-?\d+(\.\d+)?$/.test(val + '');
}

---

@Vordreller：我纠正了正则表达式。它现在应该正常工作。

Answer 5

function is_numeric(val) {
  return ((+val) == val);
}

这应该可以解决问题。

Answer 6

以下是我提出的建议：

value = "2.34";
if (parseFloat(value).toString() === value) {
    alert("number");
}

这应该适用于浮动和整数，正面和负面。我不知道无限，正如上面的一些答案所讨论的那样。

如果您的值实际上可能是一个数字而不是一个字符串，您可以将===更改为==，它将同时处理这两个。

Answer 7

以下是isNaN与isFinite和typeof ===“number”的基准测试

http://jsperf.com/isnan-vs-isfinite-vs/3

显然typeof ===“数字”大约快5倍

Answer 8

运行代码段以查看有关此主题的最佳答案的比较。

某些测试用例未突出显示（并且不会对摘要做出贡献）。这些案例被标记为含糊不清，因为不清楚给定值是否应该被视为数字。

＆＃13;

＆＃13;

// Each of these functions should output a truthy/falsy value if the input is
// a number
const solutionsToTest = [
  v => parseFloat(v),
  v => Number(v),
  v => !isNaN(v),
  v => typeof v != "boolean" && !isNaN(v),
  v => isFinite(String(v)),
  v => !isNaN(parseFloat(v)) && isFinite(v)
];

const testCases = [
  //[ Test Name, Test Value, Expected Output, Is Ambiguous ]

  // Whitespace
  ['""', "", false, false],
  ['"\\t"', "\t", false, false],
  ['" "', " ", false, false],

  // Infinity
  ['"Infinity"', "Infinity", false, true],
  ['"+Infinity"', "Infinity", false, true],
  ["-Infinity", -Infinity, false, true],
  ["Infinity", Infinity, false, true],

  // Numbers mixed with symbols
  ['"123abc"', "123abc", false, true],
  ['"abc123"', "abc123", false, false],
  ['".0."', ".0.", false, false],
  ['"1."', "1.", true, true],
  ['"."', ".", false, true],
  ['"01"', "01", true, true],
  ['"-0"', "-0", true, true],
  ["+1", +1, true, true],
  ["-1", -1, true, true],

  // Other js types
  ["'null'", "null", false, false],
  ["'true'", "true", false, false],
  ["'false'", "false", false, false],
  ["null", null, false, false],
  ["true", true, false, false],
  ["false", false, false, false],
  ["NaN", NaN, false, false],
  ["[]", [], false, false],
  ["{}", {}, false, false],
  ["/./", /./, false, false],
  ["() => {}", () => {}, false, false]
];

const styles = {
  code: {
    fontFamily: "monospace",
    fontSize: 16
  },
  success: {
    backgroundColor: "#00ff5478"
  },
  failure: {
    backgroundColor: "#ff00008c"
  }
};

class TestCaseTable extends React.Component {
  static renderTableHeader(solutionsToTest) {
    return (
      <tr>
        <th>
          <p>Test Case</p>
        </th>
        {solutionsToTest.map(f => (
          <th key={f.toString()}>
            <p style={styles.code}>{f.toString()}</p>
          </th>
        ))}
      </tr>
    );
  }
  static renderTableRow(testCase, solutionsToTest) {
    const [testName, input, expectedOutput, isAmbiguous] = testCase;
    return (
      <tr key={testName}>
        <td style={styles.code}>{testName}</td>
        {solutionsToTest.map(f => {
          const output = Boolean(f(input));
          const style = isAmbiguous
            ? {}
            : output == expectedOutput ? styles.success : styles.failure;
          return (
            <td style={style} key={f.toString()}>
              <p>{output + ""}</p>
            </td>
          );
        })}
      </tr>
    );
  }
  render() {
    // Sort test cases, put the ambiguous ones after (but maintain stable sort
    // order)
    let sortedCases = [
      ...testCases.filter(([a, b, c, ambiguous]) => !ambiguous),
      ...testCases.filter(([a, b, c, ambiguous]) => ambiguous)
    ];
    return (
      <table>
        <thead>{TestCaseTable.renderTableHeader(solutionsToTest)}</thead>
        <tbody>
          {sortedCases.map(tc =>
            TestCaseTable.renderTableRow(tc, solutionsToTest)
          )}
        </tbody>
      </table>
    );
  }
}
class TestCaseSummaryTable extends React.Component {
  renderTableHeader(solutionsToTest) {
    return (
      <tr>
        <th>Summary</th>
        {solutionsToTest.map(f => (
          <th key={f.toString()}>
            <p style={styles.code}>{f.toString()}</p>
          </th>
        ))}
      </tr>
    );
  }
  renderSuccessRateRow(solutionsToTest, testCases) {
    // Ignore potentially ambiguous test cases
    testCases = testCases.filter(
      ([name, input, expected, ambiguous]) => !ambiguous
    );

    const numSuccess = testSolution =>
      testCases.reduce((succeeded, [name, input, expected]) => {
        return succeeded + (Boolean(testSolution(input)) == expected ? 1 : 0);
      }, 0);

    return (
      <tr>
        <td>
          <p>Test Success</p>
        </td>
        {solutionsToTest.map(f => (
          <td>
            <p>
              {numSuccess(f)} / {testCases.length}
            </p>
          </td>
        ))}
      </tr>
    );
  }
  render() {
    return (
      <table>
        <thead>{this.renderTableHeader(solutionsToTest)}</thead>
        <tbody>{this.renderSuccessRateRow(solutionsToTest, testCases)}</tbody>
      </table>
    );
  }
}

const root = () => {
  return (
    <div>
      <TestCaseSummaryTable />
      <TestCaseTable />
    </div>
  );
};

ReactDOM.render(root(), document.querySelector("#application"));

＆＃13;

td {
  text-align: center;
  vertical-align: middle;
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="application"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 9

这是我的解决方案：ES6 / 2015

免责声明： 仅当用户发送数字类型作为输入时，此解决方案才有效。例如：23是数字类型，但'23'不是数字类型，它是字符串类型。

function isValidNumber(value) {
  return typeof value === 'number' && Number.isNaN(value) === false;
}

测试用例

isValidNumber(10) // true
isValidNumber(10.34) // true
isValidNumber('geo10') // false
isValidNumber('10geo') // false
isValidNumber('') // false
isValidNumber(NaN) // false
isValidNumber(true) // false
isValidNumber(false) // false