How to remove a property from a JavaScript object

There are various ways to remove a property from a JavaScript object. Find out the alternatives and the suggested solution

⭐️ 👀 2023 WEB DEVELOPMENT BOOTCAMP starting in days! Join the waiting list to reserve your spot in my 10-weeks cohort course and learn the fundamentals, HTML, CSS, JS, Tailwind, React, Next.js and much much more! 👀 ⭐️

The semantically correct way to remove a property from an object is to use the delete keyword.

Given the object

const car = {
  color: 'blue',
  brand: 'Ford'
}

you can delete a property from this object using

delete car.brand

Delete a property from an object in JavaScript

It works also expressed as:

delete car['brand']
delete car.brand
delete newCar['brand']

Setting a property to undefined

If you need to perform this operation in a very optimized way, for example when you’re operating on a large number of objects in loops, another option is to set the property to undefined.

Due to its nature, the performance of delete is a lot slower than a simple reassignment to undefined, more than 50x times slower.

However, keep in mind that the property is not deleted from the object. Its value is wiped, but it’s still there if you iterate the object:

Iterate over the object

Using delete is still very fast, you should only look into this kind of performance issues if you have a very good reason to do so, otherwise it’s always preferred to have a more clear semantic and functionality.

Remove a property without mutating the object

If mutability is a concern, you can create a completely new object by copying all the properties from the old, except the one you want to remove:

const car = {
  color: 'blue',
  brand: 'Ford'
}
const prop = 'color'

const newCar = Object.keys(car).reduce((object, key) => {
  if (key !== prop) {
    object[key] = car[key]
  }
  return object
}, {})

(see Object.keys())

Create a new object without mutating the original

One more thing! ⚠️ ✋

At the end of January I will organize the Web Development Bootcamp.

It's a 10-weeks long cohort online course where I will guide you to becoming a Web Developer.

It's not "just a course". It's a big event I organize once a year.

We'll start from zero, learn the fundamentals of Web Development, HTML CSS, JavaScript, Tailwind, Git, using the command line, VS Code, GitHub, Node.js, we'll then learn React, JSX, how to use PostgreSQL, Astro, Next.js, Prisma, deploying on Netlify/DigitalOcean/Fly/Vercel and much more! 

At the end of the first 10 weeks you'll know how to create web sites and web applications and I'll unlock you the 2nd phase of the Bootcamp: you will get access to a large number of projects exclusive to the Bootcamp graduates, so you can follow my instructions to build things like private areas with authentication, clones of popular sites like Twitter YouTube Reddit, create e-commerce sites, and much much more.

Because once you got the fundamentals, you only learn by working on real, exciting projects.

To find out more, visit bootcamp.dev