How to remove a property from a JavaScript object

Operator delete is unexpectedly slow!

Look at the benchmark.

Delete is the only true way to remove object's properties without any leftovers, but it works ~ 100 times slower, compared to it's "alternative", setting object[key] = undefined.

This alternative is not the correct answer to this question! But, if you use it with care, you can dramatically speed up some algorithms. If you are using delete in loops and you have problems with performance, read the verbose explanation.

When should one use delete and when set value to undefined ?

An object may be seen as a set of key-value pairs. What I call a 'value' is a primitive or a reference to other object, connected to that 'key'.

Use delete, when you are passing the result object to the code on which you don't have control (or when you are not sure about your team or yourself).

It deletes the key from the hashmap.

 var obj = {
     field: 1     
 };
 delete obj.field;

Use setting to undefined, when you care about performance. It can give a serious boost to your code.

The key remains on its place in the hashmap, only the value is replaced with undefined. Understand, that for..in loop will still iterate over that key.

 var obj = {
     field: 1     
 };
 obj.field = undefined;

Using this method, not all ways of determining property existence will work as expected.

However, this code:

object.field === undefined

will behave equivalently for both methods.

Tests

To summarize, differences are all about ways of determining the property existence, and about for..in loop.

 console.log('* -> "Takes prototype inheritance into consideration, that means it lookups all over prototype chain too."');

 console.log(obj.field === undefined, 'obj.field === undefined', 'You get "undefined" value when querying for "field" in object-hashmap. *');

 console.log(obj["field"] === undefined, 'obj["field"] === undefined', 'Just another way to query (equivalent). *');

 console.log(typeof obj.field === "undefined", 'typeof obj.field === "undefined"', 'Get the value attached to "field" key, and check it\'s type is "undefined". *');

 console.log(! ("field" in obj), '! ("field" in obj)', 'This statement returns true if "field" key exists in the hashmap. False otherwise. *');

 console.log(obj.hasOwnProperty("field"), 'obj.hasOwnProperty("field")', 'This statement returns true if 'field' key exists in the hashmap. The ONLY way NOT to lookup for property in the prototype chain!');
 //Object.keys().indexOf() is an overkill :)

 var counter = 0,
     key;
 for (key in obj) {
     counter++;
 }
 console.assert(counter === 0, 'counter === 0', '"field" is not iterated using "for .. in" loop. *');

var myJSONObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

delete myJSONObject.regex;

alert ( myJSONObject.regex); // alerts: undefined

This works in Firefox and Internet Explorer, and I think it works in all others.

In arrays, unlike objects, using the delete keyword leaves null or undefined artifacts.

var array = [1,2,3,4];
delete array[2];
//Expected result --> [1,2,4]
//Actual result   --> [1,2,null,4]

This can be problematic if the array needs to be precise. For example, in a webapp that uses JSON serialized arrays to hold data in localStorage, and uses the indexes as well as the values within. This will result in "null" showing up, or if you use an if statement, completely skip numbers. Another problem is that JSON serialization also saves the null values, so this could rapidly result in clutter.

Instead, what you want to do is instead make a sort of garbage collection method

Array.prototype.remove = function(index){
    delete this[index];
    return this;
};
Array.prototype.clean = function(){
    var arr1 = this, arr2 = [];
    for(var a in arr1){
        if(arr1[a]&&arr1.hasOwnProperty(a)){
            arr2.push(arr1[a]);
        }
    }
    this.splice(0);
    for(var b in arr2){
        if(arr2.hasOwnProperty(b)){
            this.push(arr2[b]);
        }
    }
    return this;
};
var array = [1,2,3,4];
array.remove(2).clean();
// Result --> [1,2,4]

Or, more concisely, you could just use array.splice like this:

Array.prototype.remove = function(index){
  this.splice(index,1);
}

Another alternative is to use the Underscore.js library.

Note that _.pick() and _.omit() both return a copy of the object and don't directly modify the original object. Assigning the result to the original object should do the trick (not shown).

Reference: http://underscorejs.org/#pick _.pick(object, *keys)

Return a copy of the object, filtered to only have values for the whitelisted keys (or array of valid keys).

var myJSONObject = 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

_.pick(myJSONObject, "ircEvent", "method");
=> {"ircEvent": "PRIVMSG", "method": "newURI"};

Reference: http://underscorejs.org/#omit _.omit(object, *keys)

Return a copy of the object, filtered to omit the blacklisted keys (or array of keys).

var myJSONObject = 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

_.omit(myJSONObject, "regex");
=> {"ircEvent": "PRIVMSG", "method": "newURI"};

For arrays, _.filter() and _.reject() can be used in a similar manner.

The term you have used in your question title Remove a property from a JavaScript object, can be interpreted in some different ways. The one is to remove it for whole the memory and the list of object keys or the other is just to remove it from your object. As it has been mentioned in some other answers, the delete keyword is the main part. Let's say you have your object like:

myJSONObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

If you do:

console.log(Object.keys(myJSONObject));

the result would be:

["ircEvent", "method", "regex"]

You can delete that specific key from your object keys like:

delete myJSONObject["regex"];

Then your objects key using Object.keys(myJSONObject) would be:

["ircEvent", "method"]

But the point is if you care about memory and you want to whole the object gets removed from the memory, it is recommended to set it to null before you delete the key:

myJSONObject["regex"] = null;
delete myJSONObject["regex"];

The other important point here is to be careful about your other references to the same object. For instance, if you create a variable like:

var regex = myJSONObject["regex"];

Or add it as a new pointer to another object like:

var myOtherObject = {};
myOtherObject["regex"] = myJSONObject["regex"];

Then even if you remove it from your object myJSONObject, that specific object won't get deleted from the memory, since the regex variable and myOtherObject["regex"] still have their values. Then how could we remove the object from the memory for sure?

The answer would be to delete all the references you have in your code, pointed to that very object and also not use var statements to create new references to that object. This last point regarding var statements, is one of the most crucial issues that we are usually faced with, because using var statements would prevent the created object from getting removed.

Which means in this case you won't be able to remove that object because you have created the regex variable via a var statement, and if you do:

delete regex; //False

The result would be false, which means that your delete statement haven't been executed as you expected. But if you had not created that variable before, and you only had myOtherObject["regex"] as your last existing reference, you could have done this just by removing it like:

myOtherObject["regex"] = null;
delete myOtherObject["regex"];

In other words, a JavaScript object gets killed as soon as there is no reference left in your code pointed to that object.

Update: Thanks to @AgentME:

Setting a property to null before deleting it doesn't accomplish anything (unless the object has been sealed by Object.seal and the delete fails. That's not usually the case unless you specifically try).

To get more info on Object.seal: Object.seal()

delete operator (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete) is the best way to do so.

Live example to show

var foo = {bar: 'bar'};
delete foo.bar;
console.log('bar' in foo); // logs false, because bar was deleted from foo

This post is very old and I find it very helpful so I decided to share the unset function I wrote in case someone else see this post and think why its not so simple as it in PHP unset function.

The reason for writing this new unset function, is to keep the index of all other variables in this hash_map. Look at the following example, and see how the index of "test2" did not change after removing a value from the hash_map.

function unset(unsetKey, unsetArr, resort){
  tempArr = unsetArr;
  unsetArr = {};
  delete tempArr[unsetKey];
  if(resort){
    j = -1;
  }
  for(i in tempArr){
    if(typeof(tempArr[i]) !== 'undefined'){
      if(resort){
        j++;
      }else{
        j = i;
      }
      unsetArr[j] = tempArr[i];
    }
  }
  return unsetArr;
}

var unsetArr = ['test','deletedString','test2'];

console.log(unset('1',unsetArr,true)); // output Object {0: "test", 1: "test2"}
console.log(unset('1',unsetArr,false)); // output Object {0: "test", 2: "test2"}

There are a lot of good answers here but I just want to chime in that when using delete to remove a property in JavaScript, it is often wise to first check if that property exists to prevent errors.

E.g

var obj = {"property":"value", "property2":"value"};

if (obj && obj.hasOwnProperty("property2")) {
  delete obj.property2;
} else {
  //error handling
}

Due to the dynamic nature of JavaScript there are often cases where you simply don't know if the property exists or not. Checking if obj exists before the && also makes sure you don't throw an error due to calling the hasOwnProperty() function on an undefined object.

Sorry if this didn't add to your specific use case but I believe this to be a good design to adapt when managing objects and their properties.

var myJSONObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};
delete myJSONObject.regex;
alert ( myJSONObject.regex);

//Inconsistent behavior if the same object is stored in an
//array or object and also somewhere else at the same time. 
//Any inconsistency.

function my_delete (objectOrArray, index) {
    if (objectOrArray.splice) {
        objectOrArray.splice(index,1);
    } else {
        delete(objectOrArray[index]);
    }        
}