JavaScript - 扩展和剩余语法以从对象中删除特定的 属性
JavaScript - spread and rest syntax to remove specific property from object
我有一个对象如下:
let obj = {foo: 1, bar: 2, baz: 3}
我想通过调用一个方法来删除特定的 属性,该方法将要删除的 属性 的名称作为参数
removeProperty(obj, propertyName) {
let { propertyName, _, ...result } = obj
return result
}
问题是这个方法只有当我们直接在语法spead中写属性的名称时才有效,比如:let { bar, _, ...result } = obj
。但它不能通过它作为参数传递,因为语法 spead 将其创建为新变量
我们如何做到这一点,如果可能的话,除了 lodashomit
的
之外,还有其他解决方案
您可以在解构中使用计算属性:
let obj = {foo: 1, bar: 2, baz: 3}
function removeProperty(obj, propertyName) {
let { [propertyName]: _, ...result } = obj
return result
}
console.log(removeProperty(obj, 'foo'));
这会将具有值 propertyName
名称的 属性 分配给一个一次性变量,并实质上删除该键。参见 the MDN documentation。
destructuring
的另一种替代方法是使用 delete
。与 destructuring
(在桌面 Chrome)
相比,以下解决方案将时间复杂度降低了大约 35%
解决方案
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'));
性能测试
结果因使用的浏览器而异。结果相当耐人寻味。 Desktop Safari destructuring
优于 delete
,但 Desktop 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
values = {
id: 1,
name: 'hello world',
vehicle: 'car',
time: '3.30 pm',
date: '02 MAR 1990',
};
const { time, date, ...rest } = values;
now ***...rest*** contains the object values of {
id: 1,
name: 'hello world',
vehicle: 'car',
};
我有一个对象如下:
let obj = {foo: 1, bar: 2, baz: 3}
我想通过调用一个方法来删除特定的 属性,该方法将要删除的 属性 的名称作为参数
removeProperty(obj, propertyName) {
let { propertyName, _, ...result } = obj
return result
}
问题是这个方法只有当我们直接在语法spead中写属性的名称时才有效,比如:let { bar, _, ...result } = obj
。但它不能通过它作为参数传递,因为语法 spead 将其创建为新变量
我们如何做到这一点,如果可能的话,除了 lodashomit
的
您可以在解构中使用计算属性:
let obj = {foo: 1, bar: 2, baz: 3}
function removeProperty(obj, propertyName) {
let { [propertyName]: _, ...result } = obj
return result
}
console.log(removeProperty(obj, 'foo'));
这会将具有值 propertyName
名称的 属性 分配给一个一次性变量,并实质上删除该键。参见 the MDN documentation。
destructuring
的另一种替代方法是使用 delete
。与 destructuring
(在桌面 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'));
性能测试
结果因使用的浏览器而异。结果相当耐人寻味。 Desktop Safari destructuring
优于 delete
,但 Desktop 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
values = {
id: 1,
name: 'hello world',
vehicle: 'car',
time: '3.30 pm',
date: '02 MAR 1990',
};
const { time, date, ...rest } = values;
now ***...rest*** contains the object values of {
id: 1,
name: 'hello world',
vehicle: 'car',
};