如何将含4个属性的Object映射赋值给3个属性的目标Object

你需要从已有的role对象中排除多余的roleId字段，仅保留name、description、isModerator三个字段赋值给roleDetails，直接执行roleDetails = role会把所有字段全带过去，还会存在对象引用共享的问题，可以用以下几种方式实现需求：

• 解构剩余运算符（最推荐，代码最简洁）
  利用ES6的对象解构语法，把不需要的roleId单独拆解出来，剩余字段自动归集到新对象中，同时生成的是浅拷贝的新对象，不会和原对象互相影响：

  const { roleId, ...roleDetails } = role;
  

• 手动映射目标字段（可读性最高，无兼容问题）
  如果需要兼容不支持ES6解构的老旧环境，或者希望代码逻辑一眼能看懂，直接新建对象手动取需要的字段赋值即可：

  const roleDetails = {
    name: role.name,
    description: role.description,
    isModerator: role.isModerator
  };
  

• 通用pick工具函数（适合同类场景复用）
  如果项目里有大量「从大对象中挑选指定字段生成新对象」的需求，可以封装一个通用的字段提取函数，后续直接传目标字段列表就能调用：

  function pick(source, keys) {
    const target = {};
    keys.forEach(key => {
      if (Object.prototype.hasOwnProperty.call(source, key)) {
        target[key] = source[key];
      }
    });
    return target;
  }
  
  // 调用示例
  const roleDetails = pick(role, ['name', 'description', 'isModerator']);
  

注意：不要直接使用roleDetails = role赋值，该写法是将原对象的内存地址直接赋值给新变量，不仅会残留多余的roleId字段，后续修改roleDetails或者role任意一方的属性，另一方也会同步变更，容易引发隐蔽的bug。

以上任意一种写法执行后，调用console.log(roleDetails)都会得到你预期的输出：

{
  name: "HR",
  description: "HR of the Company",
  isModerator: "N"
}

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