JavaScript删除对象属性的几种方法总结

作者:拾光时间:2026-10-30 20:09:28浏览:474

本文总结了JavaScript中删除对象属性的两种主要方法。第一种是使用delete运算符,支持通过点语法和方括号语法动态删除属性,但会修改原对象。第二种是利用rest解构语法创建新对象,从而保留原对象不变,同样支持静态和动态属性名删除,并可一次性处理多个属性。

介绍如何在JavaScript中移除对象内的属性。

1. 使用delete运算符

示例如下:

1) 使用点属性访问器进行删除:

delete object.property;

当对属性访问器应用delete运算符时,该运算符会从对象中移除对应的属性。

const obj = {name: '十六个人博客',url: 'rwlok.com'};
delete obj.url;
console.log(obj); // { name: '十六个人博客' }

2) 使用方括号属性访问器进行删除:

delete object['property'];// orconst name = 'dynamicProperty';
delete object[name];

使用delete运算符删除属性具有可变性,因为它会直接修改原始对象。

若需删除的属性名称是动态确定的,可以使用方括号语法来实现。

const obj = {  name: '十六个人博客',  url: 'rwlok.com'};
const name = 'url';
delete obj[name];
console.log(obj); // { name: '十六个人博客' }

2. 使用rest解构对象

1) 当属性名称已知时:

const { property, ...restObject } = object;

应用解构和rest语法后,restObject将包含与object相同的属性,但不包含被删除的属性。

const obj= {
  name: '十六个人博客',
  url: 'rwlok.com'
};
const { url, ...objRest } = obj;
console.log(objRest); // { name: '十六个人博客' }
console.log(obj); // { name: '十六个人博客',url: 'rwlok.com' }

2) 当属性名称是动态确定的时:

const name = 'property';
const { [name]: removedProperty, ...restObject } = object;

若需删除的属性名称是动态确定的,可以使用动态属性名称的解构语法。

const obj = {  name: '十六个人博客',  url: 'rwlok.com'};
const name = 'url';
const { [name]: removedProperty, ...objRest } = obj;
console.log(objRest); // { name: '十六个人博客' }

rest结构方法还可以一次性删除多个属性。

const obj = {
  name: '十六个人博客',
  url: 'rwlok.com',
  title: '卡卡测速网', 
};
const { url, title, ...objRest } = obj;
console.log(objRest); // { name: '十六个人博客' }

附:通过赋值得到方式

const car = {
  color: 'blue',
  brand: 'Ford'
}
const prop = 'color'

const newCar = Object.keys(car).reduce((object, key) => {
  if (key !== prop) {
    object[key] = car[key]
  }
  return object
}, {})

总结

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

作者最新文章