Suggest an editImprove this articleRefine the answer for “Removing a property from an object”. Your changes go to moderation before they’re published.Approval requiredContentWhat you’re changing🇺🇸EN🇺🇦UAPreviewTitle (EN)Short answer (EN)**The simplest way is the `delete obj.key` operator, which removes the property from the object directly; the immutable alternative is destructuring with rest syntax, `const { age, ...rest } = user`, which builds a new object without that key.** There is also `Reflect.deleteProperty(obj, key)`, the formal equivalent of `delete` used in metaprogramming, and plain nulling of the value (`obj.key = null`) when the key must stay but the value should be reset. Note that `delete` only works on object properties, does not touch the prototype and returns `true` even when the property did not exist. ```javascript const user = { name: 'Maria', age: 25, city: 'Kyiv' }; delete user.age; // mutates the object const { city, ...withoutCity } = user; // a new object without city ``` **Key point:** `delete` and `Reflect.deleteProperty()` mutate the object, rest destructuring creates a new one, and `= null` only clears the value without removing the key.Shown above the full answer for quick recall.Answer (EN)Image**A property is removed with the `delete` operator, and when the original object must stay untouched you use destructuring with rest syntax, which returns a new object without that key.** On top of that there is `Reflect.deleteProperty()` for metaprogramming and plain nulling of the value when the key itself has to remain in the object. ## Theory ### TL;DR - `delete obj.key` is the simplest and most common way, and it mutates the object. - `delete` works only on object properties, not on variables. - `delete` returns `true` even when the property did not exist, and it does not affect the prototype. - `const { key, ...rest } = obj` is the immutable way: it creates a new object without the key. - `Reflect.deleteProperty(obj, key)` has the same effect but in plain function form. - `obj.key = null` or `undefined` does not remove the key, it only clears the value. ### Quick example ```javascript const user = { name: 'Maria', age: 25, city: 'Kyiv' }; delete user.age; console.log(user); // { name: 'Maria', city: 'Kyiv' } ``` ### The delete operator The simplest and most common way: ```javascript const user = { name: 'Maria', age: 25, city: 'Kyiv' }; delete user.age; console.log(user); // { name: 'Maria', city: 'Kyiv' } ``` The `delete` operator removes the property **from the object directly**. Important details: - `delete` works **only on object properties**, not on variables. - It returns `true` even when the property did not exist: ```javascript delete user.nonexistent; // true ``` - It **does not affect the prototype**, only the object itself. If a property with the same name exists on the prototype, reading it after the own property is deleted starts returning the prototype one. - In strict mode, deleting a non-configurable (`configurable: false`) property throws a `TypeError`; outside strict mode it simply returns `false`. ### Destructuring (the immutable way) When you want to **create a new object without a property** and leave the original alone: ```javascript const user = { name: 'Maria', age: 25, city: 'Kyiv' }; const { age, ...updatedUser } = user; console.log(updatedUser); // { name: 'Maria', city: 'Kyiv' } ``` Here `...rest` collects every remaining property, so the removal happens "softly", without changing the original. This is exactly the approach React and Redux need, where state is compared by reference. If the key name is only known at runtime, use a computed key: `const { [key]: removed, ...rest } = user;`. ### Reflect.deleteProperty() This is the modern alternative to `delete`, equivalent in meaning but handy in more formal scenarios such as metaprogramming: ```javascript const user = { name: 'Maria', age: 25 }; Reflect.deleteProperty(user, 'age'); console.log(user); // { name: 'Maria' } ``` The behaviour matches `delete`, but it is an ordinary function, so the key can be passed in a variable and the result (`true` or `false`) is returned strictly, without throwing in strict mode. ### Nulling or overwriting the value Sometimes it is safer not to remove the property but simply to reset its value: ```javascript user.age = null; // the value is cleared logically // or user.age = undefined; ``` Such a property stays in the object, but its value counts as "empty". The difference shows up immediately: `'age' in user` still returns `true` and `Object.keys(user)` still lists the key. Note that `JSON.stringify()` drops properties whose value is `undefined` but keeps those equal to `null`. ### Comparison of the ways | Way | Mutates the original object | What it does | Note | | --- | --- | --- | --- | | `delete obj.key` | Yes | Removes the property | Simple and common | | `Reflect.deleteProperty(obj, key)` | Yes | The same, but in function form | Used in metaprogramming | | Destructuring `{ key, ...rest }` | No | Creates a new object without the property | The immutable approach | | `obj.key = null` | Yes | "Clears" the value but keeps the key | Handy when resetting state | ### Common mistakes - **Believing `= undefined` deletes a property.** The key stays: `'age' in user` returns `true` and `Object.keys()` still shows it. Only `delete` removes it. - **Relying on the result of `delete`.** It returns `true` for a non-existent property too, so it is not a success check. Test for the key with `Object.hasOwn()`. - **Using `delete` on array elements.** `delete arr[1]` leaves an empty slot and does not shrink `length`. For arrays use `splice()` or `filter()`. - **Expecting `delete` to remove an inherited property.** It only removes an own property; anything coming from the prototype stays reachable. - **Mutating a shared object.** If the object is used in several places, `delete` changes it for all of them. When a new reference is needed, use rest destructuring.For the reviewerNote to the moderator (optional)Visible only to the moderator. Helps review go faster.