JavaScript 如何删除数组中所有对象的属性
这篇文章将介绍如何在JavaScript中删除数组中所有对象的属性。
在JavaScript中,键值对的集合构成了一个对象。其中的一个键值对被称为对象的属性。任何数据类型,包括数字、字符串、数组、对象等,都可以用作属性的键和值。
有两种方法可以实现这个目标:一种是可变的,使用delete操作符;另一种是不可变的,使用对象解构。让我们讨论一下这种方法。
删除操作符
delete操作符既删除属性的值,也删除属性本身。被删除的属性必须重新添加才能在被删除后再次使用。对象的属性可以使用delete操作符删除,变量和函数不受影响。
示例
以下示例中,我们使用delete方法来删除数组中的一个对象。
<!DOCTYPE html>
<html>
<body>
<p id = "tutorial"></p>
<script>
const arr = [
{id: 1, name: 'teja', test: 'abd'},
{id: 2, name: 'suri', test: 'msd'},
];
arr.forEach(object => {
delete object['name'];
});
document.getElementById("tutorial").innerHTML= JSON.stringify(arr);
</script>
</body>
</html>
当脚本被执行时,它将生成一个由数组组成的输出,在web浏览器上显示,通过使用触发用户执行脚本时的delete方法从实际数组中删除对象。
对象解构
使用对象解构和扩展语法是另一种以不改变原始对象的方式以不可变方式删除属性的方法。
每次调用delete运算符只能删除一个属性。因此,如果您想删除age和gender属性,则需要进行两个delete调用。另外,您可以通过一次调用对象解构来删除多个属性。
示例
考虑以下示例,我们使用对象解构来删除对象。
<!DOCTYPE html>
<html>
<body>
<p id = "tutorial"></p>
<script>
const person = {
firstName: "don",
lastName: "bosco",
gender: "Male",
age: 21
};
const {age, gender, ...personTrimmed} = person;
const json = JSON.stringify(personTrimmed);
document.getElementById("tutorial").innerHTML=JSON.stringify(json);
</script>
</body>
</html>
示例
让我们来看一个使用 delete 关键字来移除 JavaScript 中的属性的另一个例子。
<!DOCTYPE html>
<html>
<body>
<p id = "tutorial"></p>
<script>
var values = [
{
"firstName": "John",
"lastName":"Smith"
},
{
"firstName": "David",
"lastName":"Miller"
},
{
"firstName": "Adam",
"lastName":"Smith"
}
];
values.forEach(function(obj){ delete obj.lastName });
document.getElementById("tutorial").innerHTML=JSON.stringify(values);
</script>
</body>
</html>