JavaScript delete Operator
The delete
operator in JavaScript is used to remove a property from an object. It works for both properties owned by the object and those inherited from prototypes. When used on an array item, it creates a ‘hole’ in the array.
Syntax:
delete object
// or
delete object.property
// or
delete object['property']
Parameter: It does not take any parameters.
Return type: This operator returns true if it removes a property. While deleting an object property that doesn’t exist will return a true but it will not affect the object. However, while trying to delete a variable or a function will return a false.
JavaScript delete Operator Examples
Example 1: In this example, the salary
property exists in the emp
object, the delete
operation is successful, and true
is logged to the console.
let emp = {
firstName: "Raj",
lastName: "Kumar",
salary: 40000
}
console.log(delete emp.salary);
console.log(emp);
Output
true { firstName: 'Raj', lastName: 'Kumar' }
Explanation:
The code defines an object `emp` with properties `firstName`, `lastName`, and `salary`. `delete emp.salary` attempts to delete the `salary` property. It returns `true` if successful, and `false` otherwise. However, the property is still present in the `emp` object, as demonstrated by the subsequent `console.log(emp)`.
Example 2: Here’s an example illustrating the behavior of delete
with a non-configurable property
// Define an object with a non-configurable property
let obj = {
name: "John"
};
Object.defineProperty(obj, 'age', {
value: 30,
configurable: false // Making 'age' property non-configurable
});
console.log(obj); // { name: 'John', age: 30 }
// Attempt to delete the non-configurable property 'age'
let result = delete obj.age;
console.log(result); // false, deletion fails
console.log(obj); // { name: 'John', age: 30 }
Output
{ name: 'John' } false { name: 'John' }
Explanation:
- An object
obj
is defined with propertiesname
andage
. - The
age
property is made non-configurable usingObject.defineProperty()
withconfigurable: false
. - An attempt is made to delete the
age
property usingdelete obj.age
, which returnsfalse
because the property is non-configurable. - The
age
property remains unchanged in the objectobj
.
Example 3: Here, we are deleting Array Values Using delete
let arr = [1, 2, 3]
console.log(delete arr[0]); //true
console.log(arr); //[empty, 2, 3]
Output
true [ <1 empty item>, 2, 3 ]
Explanation:
delete arr[0]
removes the element at index 0 from the arrayarr
.- The deleted element is replaced with an empty slot, represented by the string
'empty'
. - The array still retains its original length but has an empty slot at index 0.
Example 4: In JavaScript, global properties declared with var
or created without any declaration can be deleted.
var globalVar = 10;
let localVar = 20;
console.log(delete globalVar); // true, deletion successful
console.log(delete localVar); // false, deletion fails
console.log(globalVar); // undefined
console.log(localVar); // 20, deletion failed
Output
false false 10 20
Explanation:
globalVar
is declared withvar
andlocalVar
withlet
.delete globalVar
returnstrue
, deleting the global property.delete localVar
returnsfalse
becauselet
variables cannot be deleted.globalVar
becomesundefined
after deletion, butlocalVar
remains unchanged.
Conclusion:
Some developers use setting an object property’s value to null or undefined as an alternative method. However, this doesn’t fully remove the property; it still exists with the value of null or undefined. It can cause issues with operations like the ‘for…in’ loop. Additionally, using the delete operator in loops can significantly slow down the program. Therefore, it’s best to use delete only when it’s really necessary to remove an object property.