使用扩展运算符从 ES6 中的对象中删除目标参数

Question

我正在尝试使用展开运算符从对象中删除属性。传统上我是这样做的：

const original_object = { prop1 : 'string1', prop2: 'string2' }; const { prop1, ...rest } = original_object;

在上述情况下，删除的属性(prop1) 将不再存在于 rest 对象中。

假设我想删除一个更复杂属性，例如对象中的对象。

const original_object = { prop1: 'string1' prop2: { prop3: 'string3', prop4: 'string4' } } const { *remove prop3 of prop2 only here*, ...rest} = original_object; console.log(prop3); // => 'string3';

最elegant/easiest解决这个问题的方法是什么？除了 prop2 中的 prop3 之外的所有内容，我都希望以完全相同的结构包含在对象中。

Answer 1

分两步完成 - 首先将 prop3 解构出来，然后创建一个新对象，将外部对象的其余部分与 prop2 结合起来，并从中移除 prop3:

const original_object = {
    prop1: 'string1',
    prop2: {
        prop3: 'string3',
        prop4: 'string4'
    }
};
const { prop2: { prop3, ...restProp2 }, ...restOrig} = original_object;
const newObj = { ...restOrig, prop2: restProp2 };
console.log(prop3); // => 'string3';
console.log(newObj);

虽然您可以只用一个 hack 语句来做到这一点，但我不推荐它。

如果您发现自己经常使用深度嵌套的属性执行此操作，并且不喜欢额外的行，则可以考虑以下行的辅助函数：

const getNestedFrom = (obj, propStr) => {
  // make a copy, don't mutate the original object
  const newObj = JSON.parse(JSON.stringify(obj));
  const props = propStr.split('.');
  const lastProp = props.pop();
  const lastObj = props.reduce((a, prop) => a[prop], newObj);
  const val = lastObj[lastProp];
  delete lastObj[lastProp];
  return [newObj, val];
};


const original_object = {
    prop1: 'string1',
    prop2: {
        prop3: 'string3',
        prop4: 'string4'
    }
};
const [newObj, prop3] = getNestedFrom(original_object, 'prop2.prop3');
console.log(prop3); // => 'string3';
console.log(newObj);

出于好奇（请不要这样做），破解方法是使用默认值属性，这绝对不会存在：

const original_object = {
    prop1: 'string1',
    prop2: {
        prop3: 'string3',
        prop4: 'string4'
    }
};
const [
  { prop2: { prop3, ...restProp2 }, ...restOrig},
  newObj = { ...restOrig, prop2: restProp2 }
] = [original_object]
console.log(prop3); // => 'string3';
console.log(newObj);

但这会造成严重（且不必要的）混乱。

使用扩展运算符从 ES6 中的对象中删除目标参数

Removing targeted parameter from Object in ES6 using spread operator

javascript

typescript

spread-syntax