JavaScript中删除对象属性的5种方法详解

1.将属性设置为 undefined

这种方法只是将属性值赋为 undefined，属性本身仍然保留在对象中，并且会直接修改原始对象。

const pet = { 
  species: 'dog', 
  age: 3, 
  name: 'celeste', 
  gender: 'female' 
}; 
 
pet.gender = undefined; 
Object.keys(pet); // ['species', 'age', 'name', 'gender'] 

2.使用 delete 操作符

delete 操作符会从对象中彻底移除指定属性，同样会修改原始对象，但执行速度相对较慢。

const pet = { 
  species: 'dog', 
  age: 3, 
  name: 'celeste', 
  gender: 'female' 
}; 
 
delete pet.gender; 
Object.keys(pet); // ['species', 'age', 'name'] 

• delete 操作符用于移除对象的指定属性，如果删除成功则返回 true，否则返回 false。
• 即使要删除的属性不存在，delete 操作也不会报错或产生副作用，但仍会返回 true。
• 如果原型链上存在同名属性，delete 仅会删除对象自身的属性，而不会触及原型链上的属性。
• delete 无法删除全局作用域中的函数，以及使用 let 或 const 声明的变量或常量。
• delete 可以成功删除对象中定义的函数属性。
• 某些不可配置的属性无法被删除，例如 Math、Array、Object 等内置对象的属性，以及通过 Object.defineProperty() 方法显式设置为不可配置的属性。

3.使用对象解构

利用展开运算符 (...) 可以将对象解构为新对象，同时排除特定属性。这种方法在需要移除多个属性时非常有用，且不会修改原始对象。

const pet = { 
  species: 'dog', 
  age: 3, 
  name: 'celeste', 
  gender: 'female' 
}; 
 
const { gender, ...newPet } = pet; 
Object.keys(pet); // ['species', 'age', 'name', 'gender'] 
Object.keys(newPet); // ['species', 'age', 'name'] 

4.使用Reflect

ES6 引入的 Reflect.deleteProperty(对象, 属性名) 方法，用于删除属性并返回一个布尔值表示操作结果。

const pet = { 
  species: 'dog', 
  age: 3, 
  name: 'celeste', 
  gender: 'female' 
}; 
 
Reflect.deleteProperty(pet, 'gender')
Object.keys(pet); // ['species', 'age', 'name'] 

5.删除数组元素

• 使用 delete

delete arr[0];

使用 delete 删除数组元素后，数组长度保持不变，原索引位置的元素变为 null。

• 使用 splice

splice 方法会直接修改原数组，移除指定元素。

补充：delete 运算符主要用于删除对以前定义的对象属性或方法的引用

以下情况无法通过 delete 删除：

1. 通过 var 定义的变量，例如 var a=1; delete a 返回 false

2. 函数声明，例如 function a(){}; delete a 返回 false

3. 通过 prototype 定义的属性，例如 a.prototype.b=2; delete b 返回 false

4. 函数传入的参数，例如 function(a){delete a} 返回 false

5. 内建对象 arguments，例如 delete arguments 返回 false

以下情况可以通过 delete 删除：

1. 未通过 var/let/const 定义的变量，例如 b=1; delete b 返回 true

2. 对象的属性，例如 var obj={x:1}; delete obj.x 返回 true

总结

到此这篇关于js删除对象属性的多种方法的文章就介绍到这了,更多相关js删除对象属性内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！