JavaScript - spread和rest语法从对象中删除特定属性

Question

我有一个对象如下：

let obj = {foo: 1, bar: 2, baz: 3}

我想通过调用一个方法删除一个特定的属性，该方法将要删除的属性的名称作为参数

removeProperty(obj, propertyName) {
  let { propertyName, _, ...result } = obj
  return result
}

问题是这个方法只有在我们直接在语法spead中写出属性的名称时才有效，例如： let { bar, _, ...result } = obj 。但是通过将它作为参数传递它不起作用，因为语法spead将其创建为新变量

如果可能的话，除了omit lodash之外，我们怎么能这样做呢？

Answer 1

您可以在解构中使用计算属性：

 let obj = {foo: 1, bar: 2, baz: 3} function removeProperty(obj, propertyName) { let { [propertyName]: _, ...result } = obj return result } console.log(removeProperty(obj, 'foo')); 

这将为属性分配值propertyName的名称为一次性变量，并基本上删除该键。 请参阅MDN文档 。

Answer 2

destructuring另一种替代方法是使用delete 。 与destructuring相比，以下解决方案可将时间复杂度降低约35％（在桌面Chrome中）

解

let obj = {foo: 1, bar: 2, baz: 3}
function removeProperty(obj, propertyName) {
  let newObj = {...obj};
  delete newObj[propertyName];
  return newObj;
}
console.log(removeProperty(obj, 'foo'));

性能测试

https://jsperf.com/so53753276

结果因使用的浏览器而异。 结果相当有趣。 桌面Safari destructuring优于delete ，但桌面版Chrome将执行Desktop Safari中的所有数字。

+-----------------------------------+
| Browser | delete    | destructure |
+---------+-----------+-------------+
| Chrome  | 3,229,791 | 1,993,256   |
| Safari  | 1,186,679 | 1,872,396   | 
+---------+-----------+-------------+

iOS上的结果不那么令人惊讶，因为Chrome只是真正的Safari。

+-----------------------------------+
| Browser | delete    | destructure |
+---------+-----------+-------------+
| Chrome  | 1,146,496 | 1,785,551   |
| Safari  | 1,182,067 | 1,793,772   | 
+---------+-----------+-------------+

文档

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete