js删除对象属性

简介: 本文介绍了JavaScript中删除对象属性及数组元素的多种方法,包括设置属性为undefined、使用delete操作符、对象解构、Reflect.deleteProperty方法以及数组的delete和splice操作。每种方法均有示例代码及关键特性说明,适用于不同场景下的属性或元素删除需求,帮助开发者更高效地处理对象和数组的操作。

1.将属性设置为 undefined

属性本身仍将存在于对象中,它还会改变原始对象。

css

体验AI代码助手

代码解读

复制代码

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

2.使用 delete 操作符

delete 将完全从对象中删除属性,会导致原始对象的发生改变,但速度很慢。

css

体验AI代码助手

代码解读

复制代码

const pet = { 
  species: 'dog', 
  age: 3, 
  name: 'celeste', 
  gender: 'female' }; 
 delete pet.gender; Object.keys(pet); // ['species', 'age', 'name'] 123456789
  • delete操作符移除对象指定属性,删除成功返回true,否则返回false。
  • 删除的属性不存在,delete不会起任何作用 ,但是仍会返回true。
  • 如果原型链有同名属性,只会删除自身的属性。
  • delete不能删除全局作用域函数以及作用域中用let或const声明的属性。
  • delete可以删除对象的函数。
  • 不可设置属性不能被删除。比如Math、Array、Object内置对象属性以及使用Object.defineProperty()方法设置的属性。

3.使用对象解构

通过用展开运算符(…)可以将需要省略特定属性的对象解构到新对象。这个技巧在需要删除多个属性时特别有用,并且不会更改原始对象。

css

体验AI代码助手

代码解读

复制代码

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'] 12345678910

4.使用Reflect

ES6新增的方法,Reflect.deleteProperty(对象,属性名),返回一个布尔值。

css

体验AI代码助手

代码解读

复制代码

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

5.删除数组元素

  • delete

ini

体验AI代码助手

代码解读

复制代码

delete arr[0];1

删除后数组长度不变,原索引下元素变为null。

  • splice

会改变原数组。


转载来源:https://juejin.cn/post/7275576074591141940

相关文章
|
10月前
|
存储 人工智能 Java
java之通过Http下载文件
本文介绍了使用Java实现通过文件链接下载文件到本地的方法,主要涉及URL、HttpURLConnection及输入输出流的操作。
722 0
|
11月前
|
监控 前端开发 Java
Spring拦截链的实现原理是什么?
拦截器是Spring MVC中处理请求的重要机制,通过拦截链可在请求的不同阶段插入自定义逻辑。本文详解拦截链的实现原理、核心组件如HandlerMapping、HandlerAdapter、DispatcherServlet和HandlerInterceptor的作用,以及拦截器在请求处理中的工作流程。了解这些内容有助于开发者更好地掌握Spring MVC的请求处理机制,并灵活应用于权限验证、日志记录等场景。
176 1
|
10月前
|
人工智能 Java
Java多任务编排技术
JDK 5引入Future接口实现异步任务处理,但获取结果不够灵活。Java 8新增CompletableFuture,实现异步任务编排,支持流式处理、多任务组合及异常处理,提升执行效率与代码可读性,简化并发编程复杂度。
238 0
|
人工智能 安全 JavaScript
Java ArrayList:动态数组
本文探讨Java中的数组,对比C/C++、JS/PHP/Python等语言的数组特性。文章分析了Java数组的定义、创建方式及其规范,指出其优缺点。Java数组作为引用类型,在堆上分配内存,支持动态大小,避免了C/C++中裸数组的常见问题(如越界访问)。然而,Java数组也存在性能瓶颈和设计缺陷,例如运行时的安全检查影响速度,无法创建超大数组或泛型数组,且多线程场景下缺乏同步机制。作者建议在实际开发中用集合替代数组以规避这些问题。
298 1
|
前端开发 JavaScript 应用服务中间件
前端跨域问题解决Access to XMLHttpRequest at xxx from has been blocked by CORS policy
跨域问题是前端开发中常见且棘手的问题,但通过理解CORS的工作原理并应用合适的解决方案,如服务器设置CORS头、使用JSONP、代理服务器、Nginx配置和浏览器插件,可以有效地解决这些问题。选择合适的方法可以确保应用的安全性和稳定性,并提升用户体验。
9109 90
|
11月前
|
人工智能 Java 数据库
如何保证接口幂等性?
在分布式系统中,接口幂等性至关重要。本文详解其定义、重要性及实现方案,包括唯一索引、Token机制、分布式锁、状态机与版本号机制,并提供最佳实践建议,助你提升系统可靠性与用户体验。
2290 1
|
11月前
|
XML 人工智能 Java
Spring IOC 到底是什么?
IOC(控制反转)是一种设计思想,主要用于解耦代码,简化依赖管理。其核心是将对象的创建和管理交给容器处理,而非由程序直接硬编码实现。通过IOC,开发者无需手动new对象,而是由框架负责实例化、装配和管理依赖对象。常见应用如Spring框架中的BeanFactory和ApplicationContext,它们实现了依赖注入和动态管理功能,提升了代码的灵活性与可维护性。
271 1
|
11月前
|
存储 JSON JavaScript
[go]byte类型, string 类型, json 类型
本文介绍了Go语言中byte类型的基本概念、特点及用法。byte是8位无符号整数,取值范围为0-255,常用于二进制数据操作,如网络通信和文件读写。文章还详细说明了byte与字符串的转换、遍历byte数据以及与其他类型间的转换。此外,探讨了Go中json.Marshal和json.Unmarshal函数实现[]byte与JSON间的转换,并对比了[]byte与JSON的区别,帮助开发者更好地理解其应用场景与差异。
382 2
|
移动开发 前端开发 Java
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
JavaFX是Java的下一代图形用户界面工具包。JavaFX是一组图形和媒体API,我们可以用它们来创建和部署富客户端应用程序。 JavaFX允许开发人员快速构建丰富的跨平台应用程序,允许开发人员在单个编程接口中组合图形,动画和UI控件。本文详细介绍了JavaFx的常见用法,相信读完本教程你一定有所收获!
15122 5
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)