ES6中如何将对象解构为仅含指定属性的新对象？

我懂你的需求啦！你之前尝试的解构写法逻辑搞反了，咱们来看看几种简单又实用的实现方式：

方法1：分步解构+重构对象（最直观） #

先从原对象里解构出需要的属性，再用这些属性创建新对象，可读性拉满：

const payload = { apple: 1, dog: 2, cat: 3 };
// 第一步：解构出需要的属性
const { apple, dog } = payload;
// 第二步：用解构出的属性构建新对象（ES6简写，等同于{ apple: apple, dog: dog }）
const newPayload = { apple, dog };

方法2：一行式立即执行函数（简洁版） #

如果想少写几行代码，可以用立即执行函数把解构和对象构建合并成一行：

const payload = { apple: 1, dog: 2, cat: 3 };
const newPayload = (({ apple, dog }) => ({ apple, dog }))(payload);

这里的逻辑是：把payload传入匿名函数，函数内部解构出apple和dog，然后直接返回由这两个属性组成的新对象。

方法3：通用工具函数（适合多次复用） #

如果你的项目里经常需要从对象中提取指定属性，可以写一个通用的pick工具函数，方便重复调用：

// 定义工具函数：接收原对象和需要提取的属性名列表
const pick = (obj, ...keys) => 
  keys.reduce((result, key) => {
    // 把每个指定属性添加到结果对象中
    result[key] = obj[key];
    return result;
  }, {});

// 使用示例
const payload = { apple: 1, dog: 2, cat: 3 };
const newPayload = pick(payload, 'apple', 'dog');

为什么你之前的写法不对？ #

你写的const {{apple, dog} : newPayload} = payload是在尝试解构嵌套对象——它的逻辑是：从payload中找到一个属性，这个属性的值是包含apple和dog的对象，然后把这个对象赋值给newPayload。但你的payload里根本没有这样的嵌套属性，所以自然会出错啦～

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