JavaScript复制对象数组时排除指定元素的实现方法

我有如下源对象数组：

[
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  },
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  }
]

希望得到如下输出数组（排除每个对象中的__rowNum__属性）：

[
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com'
  },
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com'
  }
]

作为JavaScript新手，想知道如何过滤数组或复制生成新数组时排除该属性。

解决方案 #

方法1：解构赋值结合Array.map()（推荐） #

这是最直观且不会修改原对象的方法，通过解构把__rowNum__单独提取，剩下的属性自动收集到新对象中：

const sourceArray = [
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  },
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  }
];

const resultArray = sourceArray.map(item => {
  // 解构出__rowNum__，剩余属性用...rest打包成新对象
  const { __rowNum__, ...rest } = item;
  return rest;
});

console.log(resultArray);

该方法会生成全新的对象数组，完全不改动原数组和原对象，适合绝大多数场景。

方法2：使用delete操作符（需注意原对象修改风险） #

如果不介意修改原数据，或者先复制原对象再操作，可以用delete直接移除属性：

const sourceArray = [
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  },
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  }
];

// 先浅拷贝原对象，避免修改原数据
const resultArray = sourceArray.map(item => {
  const newItem = {...item};
  delete newItem.__rowNum__;
  return newItem;
});

console.log(resultArray);

注意：如果直接在原对象上执行delete，原数组里的对象也会丢失__rowNum__属性，所以务必先拷贝再操作。

方法3：Object.fromEntries结合Object.entries #

遍历对象的键值对，过滤掉目标属性后重新生成对象，适合需要批量过滤多个属性的场景：

const sourceArray = [
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  },
  {
    'joa Doe 1': 'Joe Doe 3',
    'joa1@doe.com': 'joe3@doe.com',
    __rowNum__: 2
  }
];

const resultArray = sourceArray.map(item => 
  Object.fromEntries(
    // 过滤掉键为__rowNum__的键值对
    Object.entries(item).filter(([key]) => key !== '__rowNum__')
  )
);

console.log(resultArray);

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