What is the delete Operator in JavaScript?

quiz
Challenge Inside! : Find out where you stand! Try quiz, solve problems & win rewards!

Learn via video course

Free Javascript Course - Mastering the Fundamentals
Free Javascript Course - Mastering the Fundamentals
By Mrinal Bhattacharya
Free
4.8
Enrolled: 19671
Free Javascript Course - Mastering the Fundamentals
Free Javascript Course - Mastering the Fundamentals
Mrinal Bhattacharya
Free
4.8
Enrolled: 19671
Start Learning

Overview

JavaScript developers often wonder what the delete operator even is. What is it used for? Why do we use JavaScript's delete operator? The delete operator is one of the most underutilized JavaScript operators and that's what we're going to fix right now.

The javascript delete operator is used to remove an element from an array, objects, and properties from an object. It's important to note that the javascript delete operator is not a method; it's a statement.

Syntax

  • Syntax to delete an object.
delete objectName
  • Syntax to delete the property of an object.
delete objectName.propertyName
  • Syntax to delete element from an array.
delete arrayName[index]

Description

After removing the property from the object or array element, the javascript delete operator returns true. Even if no property or index could be found in the object or array, it still returns true. Only when you attempt to delete variables and functions does it return false.

let car = {
    company: "Audi",
    color: "Black",
    price: "$45000"
}

delete car.price; // true
delete car.speed; // true
delete car; // true

Non-configurable Properties

When you set configurable as false for a property, the delete operator returns false.

let Car = {};
Object.defineProperty(Car, "name", { value: "Audi", configurable: false });

delete Car.name; // false

Strict Vs. Non-strict Mode

strict mode is used to write secure JavaScript. Deleting a property in strict mode will result in an error because the delete operator is prone to errors.

'use strict'

let car = {
    company: "Audi",
    color: "Black",
    price: "$45000"
}

delete car.name; // error

Can We Delete Variables in Javascript?

No, is the response. The javascript delete operator does not allow us to delete variables because they are not configurable like objects. The remove operator will return false if you do that.

let car = "Rolls Royce"

delete car; // false

function bike() {
    return "bike";
}

delete bike; // false

Examples

Delete and the Prototype Chain

Only the object's own properties are deleted using the delete operator. The properties of an object's prototype are unaffected. Deleting a property that is not owned by the object also has no effect but does return true.

Example:

function Car() {
    this.name = "Audi";
}

// Add a value to prototype
Car.prototype.name = "BMW";

// Create object
const car = new Car();

car.name // "Audi"

// Delete property from object
delete car.name; // true

// After deleting the property from the object you can still access that property from prototype chain
car.name // "BMW"

// Now delete that prototype property
delete Car.prototype.name // true

// "name" property is now undefined
car.name // undefined

Deleting Array Elements

Same as object properties, we can also delete elements of an array with the javascript delete operator. It will return true even if the index is not found.

let cars = ["Audi", "BMW", "Rolls Royce"]

delete cars[0]; // true
delete cars[10]; //true

Browser Compatibility

The javascript delete operator is supported by the following popular browsers.

BrowserFull support
ChromeYes
EdgeYes
FirefoxYes
OperaYes
SafariYes
Samsung InternetYes
Android WebviewYes
DenoYes
Node.jsYes

Conclusion

  • The javascript delete operator can be really useful when you want to remove an object, the property of an object, or an element from a JavaScript array.
  • delete is not a method but a statement.
  • However, there are some things that you need to be aware of so that you don't cause any bugs by using them incorrectly.
  • This article should have cleared up some of the mystery surrounding this operator and how it works in JavaScript.
Free Courses by top Scaler instructors