JS如何将逗号分隔的属性值拆分后逐个作为独立元素push到数组

通过$(this).attr('numbers')获取到的属性值是逗号拼接的完整字符串（例如"121856,121860"）。push()方法接收单个字符串参数时，会把整个字符串作为一个独立元素存入数组，和你手动传入push(121840,121841)这种多参数的逻辑完全不同，这就是数组长度不符合预期的核心原因。

核心逻辑是先把取到的字符串按逗号拆分为单个值的集合，再批量推入目标数组即可，按需还可以把拆分后的字符串转为整数类型：

• 第一步：用split(',')方法把逗号分隔的字符串拆成值数组
• 第二步：通过扩展运算符...把拆分后的值作为多个独立参数传入push()，批量存入数组
• 可选优化：自定义属性建议使用data-前缀（例如把numbers改为data-numbers），符合HTML规范，也不会和原生属性命名冲突

修改后的完整代码：

// 初始化目标数组
const numbers = [];
const names = [];

$('table tbody tr').each(function() {
  $(this).find('td:last').each(function(){
    const $currentCell = $(this);
    const numbersValue = $currentCell.attr('numbers');
    if (numbersValue) {
      // 拆分字符串并转为整数，不需要数字类型可去掉.map(Number)
      const splitNumbers = numbersValue.split(',').map(Number);
      // 批量将拆分后的值推入数组
      numbers.push(...splitNumbers);
      names.push($currentCell.parents("tbody").attr('name'));
    }
  });
});

如果需要兼容不支持ES6扩展运算符的老旧运行环境，可以把批量push的代码替换为：

Array.prototype.push.apply(numbers, splitNumbers);

运行后numbers数组的输出结果为[121856, 121860, 121840, 121841]，每个整数值都是独立数组元素，数组长度为4，符合预期。

内容的提问来源于stack exchange，提问作者B4THC4T