JavaScript中移除对象顶层指定键并保留其内部属性的方法

原始对象 #

const before = {
  keyToBeRemoved: {    // <-- 移除该键
    name1: "value 1",  // <-- 保留该属性
    name2: "value 2",  // <-- 保留该属性
    name3: "value 3",  // <-- 保留该属性
  },
  name4: "value 4",
  name5: "value 5",
  name6: "value 6",
};

目标需求 #

移除顶层键keyToBeRemoved，同时将其内部所有属性平摊到顶层，得到如下对象：

const after = {
  name1: "value 1",
  name2: "value 2",
  name3: "value 3",
  name4: "value 4",
  name5: "value 5",
  name6: "value 6",
};

常用实现模式 #

1. ES6解构+展开运算符（最简洁）

利用ES6语法快速拆分、合并对象，代码量最少：

// 提取要移除的键对应的内部对象，剩余属性存入rest
const { keyToBeRemoved = {}, ...rest } = before;
// 展开内部属性和剩余属性，生成目标对象
const after = { ...keyToBeRemoved, ...rest };

注：给keyToBeRemoved设默认空对象，是为了避免原对象中不存在该键时报错。

2. 手动遍历合并（兼容旧环境）

如果需要兼容不支持ES6的运行环境，可使用传统遍历或Object.assign实现：

const after = Object.assign({}, before);
// 把待移除键的内部属性合并到顶层
Object.assign(after, after.keyToBeRemoved);
// 删除顶层的目标键
delete after.keyToBeRemoved;

或者用循环遍历的方式：

const after = {};
for (const key in before) {
  if (key === 'keyToBeRemoved') {
    // 遍历内部属性并添加到顶层
    for (const innerKey in before[key]) {
      after[innerKey] = before[key][innerKey];
    }
  } else {
    // 其他属性直接复制
    after[key] = before[key];
  }
}

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