Why does the JavaScript "delete" operator behave differently in different browsers?

Question

I was planning on using the delete operator in JavaScript for something, when I decided to remind myself how it worked by playing with it some. I understand that "delete" is supposed to be used on object properties, but I wanted to see how it behaves on variables. However, some weird results occurred when I put the following snippet of code in different browsers:

var one = 1;
delete one;
console.log(one); // prints out 1 in Chrome, but not in Safari or Firefox

In Safari, the JavaScript console printed out the error "ReferenceError: Can't find variable: one". Firefox gave a similar response: "ReferenceError: one is not defined". However, Chrome printed out the value of the variable, 1. Can anyone explain why Chrome behaves differently than Safari and Firefox in this regard?

Answer 1

Don't trust the console. Some codes behave different there.

The following will alert 1 if you run it on a real page:

var one = 1;
delete one;
alert(one);

Demo

^{(Tested on Firefox, Chrome, IE, Safari and Opera.)}

---

Understanding delete explains why the console (or firebug) shows a different behavior:

Every execution context has a so-called Variable Object associated with it. Similarly to execution context, Variable object is an abstract entity, a mechanism to describe variable instantiation. Now, the interesing part is that variables and functions declared in a source text are actually added as properties of this Variable object.

Finally, variables declared within Eval code are created as properties of calling context’s Variable object.

When declared variables and functions become properties of a Variable object — either Activation object (for Function code), or Global object (for Global code), these properties are created with DontDelete attribute. However, any explicit (or implicit) property assignment creates property without DontDelete attribute. And this is essentialy why we can delete some properties, but not others.

So what happens in Firebug? Why is it that variables declared in console can be deleted, contrary to what we have just learned? Well, as I said before, Eval code has a special behavior when it comes to variable declaration. Variables declared within Eval code are actually created as properties without DontDelete.

Answer 2

Let's checkout the docs on delete from MDN.

The delete operator removes a property from an object.

You are using it a way that doesn't make much sense, that is to remove a local variable.

Those docs also say:

Throws in strict mode if the property is an own non-configurable property (returns false in non-strict). Returns true in all other cases.

Which means your usage here would throw an exception in strict mode, since you are using delete in an unsupported way. This is proven when you do:

var one = 1;
delete one; // returns false

And as the docs mention, a return value of false means the delete operation did not succeed.

---

If you use it properly, it should behave like you expect:

var obj = {one: 1};
delete obj.one;    // returns true
alert(obj.one);    // alerts "undefined"