what is the difference between delete an undefined property and a property which declared by const, let using delete operatorin Javascript?

Question

Please look at the code,

foo = 1;
delete foo; // true
Object.getOwnPropertyDescriptor(this,'foo').configurable // true
var bar = 2;
delete bar; // false
Object.getOwnPropertyDescriptor(this,'bar').configurable // false
const fooBar = 3;
Object.getOwnPropertyDescriptor(this,'fooBar').configurable // undefined
delete fooBar; //false
Object.getOwnPropertyDescriptor(this,'noexist').configurable // undefined
delete noexist; // true

Based on MDN the delete operator can work only with properties where their own descriptor configurable is true, so why there is a difference between delete "fooBar" and "noexist" returned value?

Answer 1

You cannot delete a constant as stated on MDN.

Any property declared with let or const cannot be deleted from the scope within which they were defined

So, when you delete constant fooBar, it returns a false. If something cannot be deleted then you will get false returned by delete statement. So for example, if you tried to delete a var like in var x=20; delete x;//returns false, then you would get a false value since var cannot be deleted within its scope. In the same way const and let variables cannot be deleted within their scopes and they would also return a false.

So, I would think like this : if something cannot be deleted when it is existing then you get a false value returned by the delete statement.

Also, if you try to delete a property that does not exist, then delete statement returns a true as stated on MDN.

If the property which you are trying to delete does not exist, delete will not have any effect and will return true.

So, when you delete noexist property on this object, it returns a true.

Answer 2

Appending to the excellent answer from CertainPerformance. When you are assigning values to an undeclared variable like foo = 1, this happens:

Object.defineProperty(window, 'foo', {configurable: true, value: 1});
console.log(delete foo);
console.log(window.foo); //deleted from window

So the configurable attribute is true and you can delete this property using the delete keyword and it will return true.

When you declare a variable with var bar = 2, this is happening:

Object.defineProperty(window, 'bar', {configurable: false, value: 2});
console.log(delete bar);
console.log(window.bar); //still the property exists, delete does not work in a non-configurable property

Here the configurable attribute is false hence you won't be able to delete it using the delete keyword. In use strict mode, this will result in an TypeError.

Remember that in JavaScript, variable declaration in the global scope using var also adds that variable as a non-configurable property to the global object. But this behavior does not happen when you do the same using const and let.

To know more on the let and const variables and how they are stored, read this answer. let and const variables are stored in a declarative environment record which is not accessible.

For the last case where the variable does not exist, still the delete returned true it is because that is how the delete operator is designed.

From the docs:

If the property which you are trying to delete does not exist, delete will not have any effect and will return true

Answer 3

Variables declared with const or let do not get assigned to the global object, hence your

const fooBar = 3;

does not show up when you do

Object.getOwnPropertyDescriptor(this,'fooBar').configurable

Only variables declared with var (or never declared at all, only assigned to, such as with foo) get assigned to the global object.

delete will return:

true for all cases except when the property is an own non-configurable property, in which case, false is returned in non-strict mode.

window.foo, having not been declared with var, let, or const, is a configurable property. window.bar, declared with your var bar, is assigned to window as a non-configurable property.

delete fooBar returns false because fooBar, although not actually a property on window, is a standalone identifier which cannot be deleted - delete will result in false whenever using delete like that would throw an error in strict mode:

'use strict';
const someVar = true;
delete someVar;

But noexist is not an identifier in your code, so there's no operation to even attempt to perform, so it returns true (and no error would be thrown in strict mode).

Answer 4

My understanding is, a variable declared with const, exists, but has the property configurable not set, that's why delete fails (and hence returns false) - the variable still exists.

Apparently deleting an inexistent variable is not an invalid operation, the goal of the operation is to delete the variable, and since it doesn't exist, the operation didn't take place, but the desired effect has been achieved (that's why returns true).