删除“对象中的某个字段”

你这个需求在实际开发里非常常见，我给你按不同场景分清楚写法（避免混用）。

一、删除“对象中的某个字段”（推荐🔥）

👉 场景：数组里的每一项对象，去掉某个 key

方式1：解构删除（最优雅）

const list = [
  { id: 1, name: "A", age: 18 },
  { id: 2, name: "B", age: 20 },
];

const newList = list.map(({ age, ...rest }) => rest);

✅ 结果：

[
  { id: 1, name: "A" },
  { id: 2, name: "B" },
];

👉 推荐原因：

不修改原数据（符合 Vue 响应式）
写法干净

方式2：delete（不推荐在 Vue 中直接用）

const newList = list.map((item) => {
  delete item.age;
  return item;
});

⚠️ 问题：

会修改原对象（副作用）
Vue2 可能不触发更新

二、删除“符合条件的整条数据”

👉 场景：删除某个 id 的对象

const newList = list.filter((item) => item.id !== 1);

三、删除“多个字段”

const newList = list.map(({ age, name, ...rest }) => rest);

四、动态删除字段（字段名不固定🔥）

👉 这个你项目里很可能会用

const removeKey = "age";

const newList = list.map((item) => {
  const { [removeKey]: _, ...rest } = item;
  return rest;
});

五、只保留某些字段（反向思路🔥）

👉 比“删除”更安全（推荐）

const newList = list.map((item) => ({
  id: item.id,
  name: item.name,
}));

👉 或通用写法：

const pick = (obj, keys) =>
  keys.reduce((acc, key) => {
    acc[key] = obj[key];
    return acc;
  }, {});

const newList = list.map((item) => pick(item, ["id", "name"]));

六、你当前项目（小程序）建议用法

结合你现在：

表单提交
页面传参
多选组件

👉 最推荐这一类👇

提交接口（只要部分字段）

const params = list.map(({ id, name }) => ({ id, name }));

去掉 UI 字段

const params = list.map(({ checked, disabled, ...rest }) => rest);

总结（给你一个判断标准）

👉 如果你问“该用哪种”：

要安全、规范 → 用解构
要过滤数据 → 用 filter
字段动态 → 用计算属性解构
接口参数 → 用 pick（保留字段）

如果你愿意，我可以帮你再补一版：

👉 “表单 / 多选 / 接口提交的数据清洗标准套路（企业级写法）”

这个对你现在项目非常有用。