javascript如何在object中删除属性
在js中,可以使用delete关键字在object中删除属性,语法格式为“delete object.属性”。delete操作符用于删除对象的某个属性,当delete操作符返回true时表示可以删除,返回false表示不能删除。
本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
从对象上删除属性的语义正确方法是使用delete关键字。
给定对象
const car = { color: 'blue', brand: 'Ford' }
您可以使用以下命令从此对象中删除属性
delete car.brand
它的工作方式还表示为:
delete car['brand'] delete car.brand delete newCar['brand']
将属性设置为undefined
如果您需要以非常优化的方式执行此操作,例如在循环中对大量对象进行操作时,另一种选择是将属性设置为undefined 。
由于其性质, delete的性能要比简单地重新分配给undefined 慢很多 ,比慢得多50倍。
但是,请记住,该属性不会从对象中删除。 它的值被擦除了,但是如果您迭代该对象,它仍然存在:
使用delete仍然非常快,只有在您有充分理由这样做时,才应研究此类性能问题,否则始终首选具有更清晰的语义和功能。
删除属性而不更改对象
扩展资料:
delete 操作符用于删除对象的某个属性。
语法:
直接使用delete操作符
delete object.property 或 delete object['property']
例如:
var person = { name: 'abc' age: 18 } delete person.name console.log(person) // {age: 18}
返回值:
delete操作符具有返回值,返回值为布尔值,对于所有情况都是true,即使是删除不存在的属性也会返回true,还是如上代码,不防打印一下返回值看看
console.log(delete person.name) //true console.log(delete person.job) //即使删除对象不存在的属性依然返回true
但是也有例外的情况(返回false),如果属性是不可配置属性(对于不可配置属性的概念,可以参考Object. defineProperty,我第一次听说这个概念的时候也有点蒙圈), 在非严格模式下,返回false,在严格模式下则会抛出语法错误的异常。
具体使用
1. 对象属性不存在
如上所述,如果删除对象不存在的属性,delete无效,但是返回值仍然为true
2. 原型链上存在该同名属性
如果delete操作符删除属性成功,则该属性将永远不存在,但是该对象原型链上存在该同名属性,则该对象会从原型链上继承该同名属性。但和内存并无关联,内存管理并不是delete操作符可以操作的,而且一点关系也没有。内存管理推荐MDN这篇文章
// 构造函数 function Person() { this.name = "张三", this.job = "工程师" } Person.prototype.name = "李四" // 创建实例对象 var p = new Person(); // 只删除p实例的name属性 delete p.name; console.log(p) => // 通过打印如下图,name属性成功删除
接下来看: console.log(p.name) => // '李四' 依然可以访问到
所以可以看出delete操作只会在自身的属性上起作用,这里能console出来'张三',是作用域链的原因,当实例本身无该属性的时候,就会去找它的protype身上有无该同名属性。
3. 使用var声明
使用var声明的属性(包括函数),不能从全局作用域或函数作用域中删除
在全局作用域中声明属性:
// 声明属性 var a = 1; // 等同于window.a delete a // 严格模式下抛出语法异常 SyntaxError console.log(a); // 1 非严格模式下 console.log(delete a); // 非严格模式下false
// 声明函数 var fn = function () { console.log(1); } delete fn // 严格模式下抛出语法异常 SyntaxError fn() // 1 非严格模式下delete失效, 函数依然存在 // 另外, 除字面量定义外,匿名函数定义函数效果也是一样
在函数作用域中声明属性(效果和在全局作用域中一样):
// 局部作用域声明属性 funtion fn() { var a = 1; delete a; // 严格模式下抛出语法异常 SyntaxError console.log(a); // 1 console.log(delete a); // 非严格模式下false } fn();
// 局部作用域声明函数 var fn = function() { var fn2 = function() { console.log(1); }; delete fn2 // 严格模式下抛出语法异常 SyntaxError console.log(delete fn2); // false 非严格模式下 fn2(); // 1 } fn();
另外, 需要注意的是,在对象中定义的函数是可以删除的,和属性一样,比如
var person = { name: '张三', showName: function () { console.log(this.name); } } delete person.showName console.log(person.showName) // undefined
4. let和const声明的属性
任何用let或const声明的属性不能够从它被声明的作用域中删除,我试了下,和var的效果是一样的,目前只能理解到这,如果知道的大神请指点下
5. 不可设置的属性
Math, Array, Object等内置对象的属性不可删除
console.log(Array.length); // 1 delete Array.length console.log(Array.from); 0
delete Array.prototype //严格模式下抛出异常 console.log(Array.prototype) // 非严格模式下,prototype依然存在, 可以自己试试了,自己动手,丰衣足食 console.log(Array.prototype.join); // 非严格模式下,join方法依然存在
需要注意的是,只是这些内置对象的属性不可删除,内置对象的方法是可以删除的,比如:
console.log(Array.forEach); // 内置函数 delete Array.forEach // 不用区分严格模式与否 console.log(Array.forEach); // undefined
Object.defineProperty()设置为不可设置的属性,不可删除
var person = {}; Object.defineProperty(person, 'name', { value: '张三', configurable: false }) delete person.name // 严格模式下,抛出异常 console.log(person.name); // 张三 console.log(delete person.name); // 非严格模式false
var, let以及const创建的不可设置的属性不能被delete操作删除
var a = 'abc'; // 属于window 等同于window.a var aVal = Object.getOwnPropertyDescriptor(window, 'a'); console.log(aVal); // aVal输入如下 // { // value: 2, // writable: true, // enumerable: true, // configurable: false // 由于是var声明的属性,所以为false // }
var a = 'abc'; // 属于window 等同于window.a delete a // 严格模式下抛出异常 var aVal = Object.getOwnPropertyDescriptor(window, 'a'); console.log(aVal); console.log(delete a); //false // 非严格模式下,aVal输入如下 // { // value: 2, // writable: true, // enumerable: true, // configurable: false // 由于是var声明的属性,所以为false // }
如果开始没有阅读,再去看看吧Object. defineProperty。如果了解,可以直接略过。
6. 删除数组
使用delete操作符删除数组总某项元素时,被删除的元素会从该数组中删除,但是数组的length并不会改变
var arr = [1, 2, 3]; delete arr[1] console.log(arr); // [1, undefined × 1, 2] console.log(delete arr[1]) // true console.log(arr[1]); // undefined
但是这里存在一个问题
console.log(1 in arr) // false
所以如果想把数组中某一项赋值成undefined时,不应该使用delete操作符,而是直接使用下边赋值
arr[1] = undefined; // 这样就可以解决上面的问题 console.log(1 in arr) // true
【推荐学习:javascript高级教程】
以上是javascript如何在object中删除属性的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

如何使用WebSocket和JavaScript实现在线语音识别系统引言:随着科技的不断发展,语音识别技术已经成为了人工智能领域的重要组成部分。而基于WebSocket和JavaScript实现的在线语音识别系统,具备了低延迟、实时性和跨平台的特点,成为了一种被广泛应用的解决方案。本文将介绍如何使用WebSocket和JavaScript来实现在线语音识别系

WebSocket与JavaScript:实现实时监控系统的关键技术引言:随着互联网技术的快速发展,实时监控系统在各个领域中得到了广泛的应用。而实现实时监控的关键技术之一就是WebSocket与JavaScript的结合使用。本文将介绍WebSocket与JavaScript在实时监控系统中的应用,并给出代码示例,详细解释其实现原理。一、WebSocket技

如何利用JavaScript和WebSocket实现实时在线点餐系统介绍:随着互联网的普及和技术的进步,越来越多的餐厅开始提供在线点餐服务。为了实现实时在线点餐系统,我们可以利用JavaScript和WebSocket技术。WebSocket是一种基于TCP协议的全双工通信协议,可以实现客户端与服务器的实时双向通信。在实时在线点餐系统中,当用户选择菜品并下单

如何使用WebSocket和JavaScript实现在线预约系统在当今数字化的时代,越来越多的业务和服务都需要提供在线预约功能。而实现一个高效、实时的在线预约系统是至关重要的。本文将介绍如何使用WebSocket和JavaScript来实现一个在线预约系统,并提供具体的代码示例。一、什么是WebSocketWebSocket是一种在单个TCP连接上进行全双工

JavaScript和WebSocket:打造高效的实时天气预报系统引言:如今,天气预报的准确性对于日常生活以及决策制定具有重要意义。随着技术的发展,我们可以通过实时获取天气数据来提供更准确可靠的天气预报。在本文中,我们将学习如何使用JavaScript和WebSocket技术,来构建一个高效的实时天气预报系统。本文将通过具体的代码示例来展示实现的过程。We

JavaScript教程:如何获取HTTP状态码,需要具体代码示例前言:在Web开发中,经常会涉及到与服务器进行数据交互的场景。在与服务器进行通信时,我们经常需要获取返回的HTTP状态码来判断操作是否成功,根据不同的状态码来进行相应的处理。本篇文章将教你如何使用JavaScript获取HTTP状态码,并提供一些实用的代码示例。使用XMLHttpRequest

用法:在JavaScript中,insertBefore()方法用于在DOM树中插入一个新的节点。这个方法需要两个参数:要插入的新节点和参考节点(即新节点将要被插入的位置的节点)。

JavaScript中的HTTP状态码获取方法简介:在进行前端开发中,我们常常需要处理与后端接口的交互,而HTTP状态码就是其中非常重要的一部分。了解和获取HTTP状态码有助于我们更好地处理接口返回的数据。本文将介绍使用JavaScript获取HTTP状态码的方法,并提供具体代码示例。一、什么是HTTP状态码HTTP状态码是指当浏览器向服务器发起请求时,服务
