JavaScript整数配置实测：别把空输入悄悄变成0

做重试次数、批量大小等配置表单时，很容易直接用Number(input.value)取得数字，再用Number.isFinite判断是否合法。但“能转换成有限数字”和“符合这个字段的输入规则”并不相同。下面用一组本地运行的JavaScript样例说明边界。

1. 空输入与真正的0，转换后会混在一起

运行以下代码：

for (const raw of ['', '   ', '0', ' 12 ', '1e3', '0x10', '12abc', 'Infinity']) {
  const n = Number(raw);
  console.log(JSON.stringify(raw), String(n), Number.isFinite(n));
}

实测输出：

这意味着只检查Number.isFinite，仍会把未填写当成0，也会接受科学记数法和十六进制写法。这些转换本身符合JavaScript语义，问题在于表单业务未必允许。

2. 先定义本字段允许的形式

以“重试次数”为例，约定输入必须是字符串，允许首尾空白，数值范围0到10；允许单独的0，拒绝前导零、小数、负数、科学记数法和十六进制。这个规则是示例业务约定，不是所有数字字段都应照搬。

function parseRetryCount(raw) {
  const text = raw.trim();
  const message = '请输入0到10之间的十进制整数';

  if (!/^(0|[1-9]\d*)$/.test(text)) {
    throw new Error(message);
  }

  const n = Number(text);
  if (!Number.isSafeInteger(n) || n > 10) {
    throw new Error(message);
  }
  return n;
}

顺序很关键：先检查字符串的形式，再转换数字，最后检查整数与范围。保留0作为合法值时，不要再用if (!n)判断“没有输入”。

3. 用边界样例验证约定

本地运行了12组输入：空字符串、纯空白均被拒绝；‘0’、’ 3 ‘、‘10’分别返回0、3、10；‘01’、‘1e1’、‘0xA’、‘1.5’、’-1’、‘11’、'Infinity’均被拒绝，符合上述约定。

若需要可重复验证，可以运行：

for (const raw of ['', '   ', '0', ' 3 ', '10', '01', '1e1', '0xA', '1.5', '-1', '11', 'Infinity']) {
  try {
    console.log(JSON.stringify(raw), parseRetryCount(raw));
  } catch (error) {
    console.log(JSON.stringify(raw), '拒绝');
  }
}

4. 把类型边界留在接口处

这个函数接收DOM输入框的字符串值，不适合直接处理任意JSON。若接口可能收到null、数字、数组或对象，应先检查typeof raw是否为string，或者另外定义数字类型的校验逻辑。不要用String(raw)默默把所有类型转成文本，也不要把前端校验当成服务端校验的替代。

对于金额、比例、端口等其他配置，应分别定义是否允许小数、正负号、前导零和单位。把这些规则写清楚后，校验代码通常很短，也更容易与测试样例对应。

本文示例已在本地JavaScript运行环境实际执行，内容由AI辅助整理并按输出核对。