JavaScript如何删除对象className属性中row-开头的类名并去除末尾空格

实现逻辑 #

遍历数组中的每个对象，将className属性按空格拆分为独立类名的数组，过滤掉所有以row-开头的类名后重新拼接为字符串，最后调用trim()方法清除首尾多余空格即可。

代码实现 #

1. 生成新数组（不修改原数据） #

const originalArr = [
  {
    type: "text",
    name: "text-1632646960432-0",
    satir: "1",
    className: "form-control col-lg-3 row-1"
  },
  {
    type: "text",
    name: "text-1632646974512-0",
    satir: "1",
    className: "form-control col-lg-6 row-8"
  }
];

const processedArr = originalArr.map(item => {
  const filteredClass = item.className
    .split(' ')
    .filter(className => !className.startsWith('row-'))
    .join(' ')
    .trim();
  return {
    ...item,
    className: filteredClass
  };
});

2. 直接修改原数组 #

originalArr.forEach(item => {
  item.className = item.className
    .split(' ')
    .filter(c => !c.startsWith('row-'))
    .join(' ')
    .trim();
});

低版本浏览器兼容方案 #

如果运行环境不支持ES6的startsWith方法，可以用正则表达式替换判断逻辑：

// 过滤条件替换为正则判断
.filter(className => !/^row-/.test(className))

内容的提问来源于stack exchange，提问作者Süleyman TAŞÇI