js字符串用正则提取数字转数组

一、核心处理流水线与三步实现法

将字符串中的数字提取为数组并不是单纯的一个正则函数调用，而是由“文本搜索”、“边界防御”和“类型转换”构成的流水线。理解这三个步骤的职责划分，是写出健壮代码的前提。

1. 第一步：全局匹配数字片段

调用字符串原生方法 String.prototype.match(regexp)。其中正则字面量必须添加全局标志修饰符 g（Global），否则 match 只会返回第一个匹配项及其捕获组信息，而不会继续向后扫描。

const text = "A12B34C56";
const rawMatches = text.match(/\d+/g);
// 输出字符串数组：["12", "34", "56"]

元字符 \d 等价于 [0-9]，量词 + 表示匹配一个或连续多个数字字符。此时得到的结果是一个由字符串构成的数组，数组中每个元素依然是 string 类型。

2. 第二步：空匹配的防御兜底

当输入的字符串完全不包含任何数字时（例如 "Hello World"），match() 方法不会返回空数组 []，而是返回 null。

如果在 null 之上直接链式调用 .map()，JavaScript 引擎会立即抛出 TypeError: Cannot read properties of null (reading 'map') 导致程序崩溃。因此必须使用逻辑或操作符 || [] 或者空值合并操作符进行保底：

const safeMatches = str.match(/\d+/g) || [];

在现代 JavaScript（ES2020+）中，也可以配合可选链语法写作 str.match(/\d+/g)?.map(Number) ?? []，两者的核心目的都是保证后续数组操作始终运行在合法的数组实例上。

3. 第三步：批量类型转换

提取出的字符串元素需要转换为数值类型。最稳健的做法是调用数组的 map() 方法并传入全局构造函数 Number：

const numbers = safeMatches.map(Number);
// 结果：[12, 34, 56] 纯数字数组 (number[])

二、常见提取场景与正则表达式调整

实际业务场景中，“数字”的定义往往各不相同。根据需求精确选择正则表达式，是避免数据提取错误的核心所在。

场景 1：提取单个独立数字字符

如果需要将连续的数字拆开成一位位的独立数字（例如银行卡号校验、数独计算、验证码拆分），应当去掉量词 +，直接使用 /\d/g：

const code = "订单2024";
const digits = (code.match(/\d/g) || []).map(Number);
// 输出结果：[2, 0, 2, 4]

场景 2：提取连续的无符号整数（最常用）

当数字代表一个整体计数或序列号时，使用 /\d+/g 将连续的数字字符组合提取为一个完整的数：

const record = "房间801，入住2人，押金300元";
const counts = (record.match(/\d+/g) || []).map(Number);
// 输出结果：[801, 2, 300]

场景 3：提取包含正负号的整数

如果文本中存在负数（例如气温、高度、坐标位移），单纯使用 /\d+/g 会丢弃负号，将 -15 识别为正数 15。此时需要在数字前加上可选的负号匹配 -?：

const log = "最低温度-15℃，最高温度8℃，温差23℃";
const temps = (log.match(/-?\d+/g) || []).map(Number);
// 输出结果：[-15, 8, 23]

场景 4：提取包含小数点的浮点数

金额、比率或传感器数据通常带有小数。如果直接用 /\d+/g 匹配 "单价19.9元"，会把小数点切断为 ["19", "9"] 两个独立整数。

为了准确捕获小数，需要引入非捕获组 (?:\.\d+)? 来匹配可选的小数部分。完整正则为 /-?\d+(?:\.\d+)?/g：

const goods = "商品原价199.99元，现折扣价-50.5元，运费0元";
const prices = (goods.match(/-?\d+(?:\.\d+)?/g) || []).map(Number);
// 输出结果：[199.99, -50.5, 0]

三、必须严格规避的两个典型陷阱

在处理数字提取与类型转换时，初学者和部分有经验的工程师常因习惯性简写而引入隐藏缺陷。以下两个问题在代码审查和线上排障中尤为高发。

陷阱一：忽略 null 返回值导致空指针异常

很多开发者在本地测试时使用的都是包含数字的样本，例如 "abc 123"，代码运行完全符合预期。但一旦线上遇到完全无数字的字符串（例如用户名 "Alice" 或空串 ""），直接调用 str.match(/\d+/g).map(...) 就会触发不可逆的运行时崩溃。

陷阱二：将 .map(Number) 随手写成 .map(parseInt)

这是一个非常隐蔽且典型的 JavaScript 语言特性陷阱。很多人认为 parseInt 更加专注整数，因此顺手写出：

// 严重隐患写法：
["10", "20", "30"].map(parseInt);
// 实际运行输出：[10, NaN, NaN] ！！！

为什么后两项会变成 NaN？原因在于 Array.prototype.map 在遍历时会向传入的回调函数依次提供三个实参：

1. item：当前数组元素的值（字符串）；
2. index：当前元素在数组中的索引数值（0, 1, 2, ...）；
3. array：被遍历的原始数组引用。

而全局函数 parseInt(string, radix) 恰好接收两个参数，第二个参数代表进制基数（Radix，取值范围为 2 到 36）。当把 parseInt 直接作为回调函数传给 map 时，数组的索引被意外当成了进制基数：

• 第一项处理：parseInt("10", 0)。在规范中，基数为 0 时默认按十进制解析，因此侥幸得到 10；
• 第二项处理：parseInt("20", 1)。由于不存在“1进制”，基数超出有效范围，直接返回 NaN；
• 第三项处理：parseInt("30", 2)。按二进制解析，但二进制只允许字符 0 和 1，字符 '3' 是非法二进制字符，无法转换，返回 NaN。

相比之下，全局 Number(value) 构造函数作为转换器时，只接收单个数值参数并忽略多余入参，或者如果写成箭头函数 x => parseInt(x, 10) 显式指定基数为 10，才能安全避免这一问题。在通常场景下，直接传递 Number 既简明又绝对安全。

四、特殊边界场景：前导零与大整数精度

在更严苛的数据处理任务中，还需要考量数字本身在 JavaScript 运行环境中的物理边界。

1. 前导零丢失问题（需谨慎评估业务需求）

如果文本中的数字是邮政编码、工号或版本代号（如 "员工编号：0042，窗口：07"），使用 Number("0042") 转换后会变为数字 42，原本的前导零将彻底消失。

如果业务要求必须保留原始位数，这种情况下不应该将其转换为 number 类型，而应当只提取为字符串数组：

const rawStr = "员工编号：0042，窗口：07";
const codeList = rawStr.match(/\d+/g) || [];
// 输出结果：["0042", "07"] 保留原始前导零

2. 超过安全整数范围的大数精度失真（BigInt 方案）

JavaScript 中标准的 Number 类型遵循 IEEE 754 双精度浮点格式，能够精确表示的整数上限是 Number.MAX_SAFE_INTEGER（即 2^53 - 1 = 9007199254740991，约 16 位数字）。

如果提取的是分布式系统生成的 18~19 位雪花算法 ID（Snowflake ID）或长订单流水号，直接用 Number() 转换会导致末位数字发生精度舍入：

const rawId = "订单号：1849283749281748293";
const normalNum = (rawId.match(/\d+/g) || []).map(Number);
console.log(normalNum[0]); // 1849283749281748200 (末位精度丢失！)

// 解决方案：使用 BigInt 进行映射
const bigIntNum = (rawId.match(/\d+/g) || []).map(BigInt);
console.log(bigIntNum[0]); // 1849283749281748293n (精确无损)

五、生产环境高复用工具函数封装

为了在项目中统一规范并避免团队成员重复踩坑，可以将上述逻辑封装为一个兼顾容错与功能扩展的通用工具函数：

/**
 * 从文本中提取数字并转换为数组
 * @param {string} text - 待提取的原始字符串
 * @param {Object} [options] - 配置选项
 * @param {boolean} [options.allowNegative=false] - 是否允许识别负数
 * @param {boolean} [options.allowFloat=false] - 是否允许识别小数浮点数
 * @param {boolean} [options.asBigInt=false] - 是否转换为BigInt以防止大数精度丢失
 * @returns {Array<number|bigint>} 转换后的数字数组
 */
function extractNumbers(text, options = {}) {
  if (typeof text !== "string" || !text) {
    return [];
  }

  const {
    allowNegative = false,
    allowFloat = false,
    asBigInt = false
  } = options;

  let patternStr = "\d+";
  if (allowFloat) {
    patternStr += "(?:\.\d+)?";
  }
  if (allowNegative) {
    patternStr = "-?" + patternStr;
  }

  const reg = new RegExp(patternStr, "g");
  const matches = text.match(reg) || [];

  if (asBigInt) {
    // BigInt 不支持浮点格式字符串，提取前请确保业务数据为整数
    return matches.map(BigInt);
  }

  return matches.map(Number);
}

// 使用示例：
extractNumbers("温度-5.6度，湿度80%", { allowNegative: true, allowFloat: true });
// 返回：[-5.6, 80]

六、方案速查与核心结论

将 JavaScript 字符串中的数字用正则提取并转为数组，在绝大多数日常开发中只需牢记以下这行简短的标准范式：

const nums = (str.match(/\d+/g) || []).map(Number);

当涉及更复杂的数据结构时，可参考下表的速查结论进行针对性调整：

牢记两个核心防御点：一是用 || [] 守住 null 边界，二是用 Number 替代 parseInt 避开 radix 传参陷阱。掌握这一套逻辑，即可应对前端与 Node.js 文本解析中的绝大多数数字提取需求。