Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to delete a getter using the delete operator in JavaScript?
In this tutorial, we are going to learn how we can delete a getter function using the delete operator in JavaScript. Getter functions are used to get the property of an object and bind the property with the getter function i.e., whenever the property is called the getter function will also be called with it. You can only have one getter or setter per name on an object as we cannot create more than two getters using the same name in JavaScript.
To delete a getter function in JavaScript we use the delete operator which uses the keyword "delete".
Syntax
Syntax to delete a getter function using delete operator is given as ?
delete object_name.property or delete object_name[property]
The delete operator can also be used to delete the normal property of an object. The delete operator is the most useful operator in the object because like array it cannot use the operators like pop(), splice(), filter() or any other method so it just uses the delete operator to remove any property from the object.
In the accessor properties we use two methods getter and setter to get and set the value of the object means both methods can be used to define the object accessors. Getter and setter properties allow us to get and set the value of the property of an object from outside the object we can also change the value without accessing the object.
Example: Deleting a Getter Property
Let's create an object with a getter function and then delete it using the delete operator:
<html>
<body>
<script>
var person = {
first_name: "Aditya",
last_name: "Chaudhary",
section: "A",
hair_color: "black",
get details() {
return "Student Details<br>" + this.first_name + " " + this.last_name + " of section " + this.section + " have " + this.hair_color + " color hairs ";
}
};
// Access the getter before deletion
document.write(person.details);
// Delete the getter property
delete person.details;
// Try to access the getter after deletion
document.write("<br>Student details (after deletion): " + person.details);
</script>
</body>
</html>
Student Details Aditya Chaudhary of section A have black color hairs Student details (after deletion): undefined
Checking Delete Operation Success
The delete operator returns true when the operation is successful:
<html>
<body>
<script>
var obj = {
name: "John",
get fullName() {
return "Mr. " + this.name;
}
};
document.write("Before deletion: " + obj.fullName + "<br>");
var deleteResult = delete obj.fullName;
document.write("Delete operation result: " + deleteResult + "<br>");
document.write("After deletion: " + obj.fullName);
</script>
</body>
</html>
Before deletion: Mr. John Delete operation result: true After deletion: undefined
Key Points
The delete operator permanently removes the getter property from the object
After deletion, accessing the property returns
undefinedDelete operation returns
truefor successful deletionYou can reassign a new getter or regular property with the same name after deletion
Delete returns
trueeven if you try to delete a non-existent property
Note ? If we are deleting one property from the object which does not exist in the object than also we get the output as true. The delete operator only returns false when trying to delete non-configurable properties.
Conclusion
The delete operator effectively removes getter properties from objects in JavaScript. Once deleted, the property becomes undefined and can be reassigned if needed.
1K+ Views
