javaScript删除对象属性总结方法

十六Code

已于 2023-09-14 15:04:48 修改

阅读量2.6w

点赞数 14

分类专栏：前端文章标签： javascript 前端开发语言

于 2023-01-09 09:48:23 首次发布

本文链接：https://blog.csdn.net/weixin_44030860/article/details/128609173

版权

前端专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文介绍了在JavaScript中删除对象属性的两种主要方式：一是使用`delete`运算符，可以通过点访问器或方括号访问器进行删除；二是利用解构和rest语法，创建一个新的不包含指定属性的对象。这两种方法都可以动态删除属性，解构法还可以同时删除多个属性。

摘要由CSDN通过智能技术生成

一、删除js中对象中属性

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: '十六个人博客' }