CODEWITHSUNDEEP
javascriptundefined
Pedro A
Pedro A

Reputation: 4313

Setting an undefined key of an object to undefined in JavaScript

If I open my JavaScript console (F12 on Chrome) and define a variable var x = {}; and then type x in the console it shows me an empty object like this: {}. So far so good.

If try to see x.a the console will give me undefined, and if I explicitly test x.a === undefined it gives true. So far so good.

Everything is telling me that the value of x.a is undefined.

So, since its value is undefined, I now execute a command that I was expecting to do absolutely nothing: x.a = undefined;. I thought this shouldn't change anything.

But now if I put x in the console, it shows {a: undefined} instead of {}. This is an evidence that something changed...

1. What is happening here?

2. Is there any situation in which this would make a difference?

3. If yes, how can I make that object go back to its initial state?

Note: of course, for question 3, re-assigning to a new {} is obviously not an option, since it would no longer === to the previous value.

Upvotes: 4

Views: 4877

Answers (3)

Felix Kling
Felix Kling

Reputation: 816322

1. What is happening here?

At first you are accessing a non-existing property. That will always return undefined as defined in the language specification.

But a property can also exist and have the value undefined, which is what you are getting when doing

x.a = undefined;

This creates the property a on x and assigns the value undefined to it.

2. Is there any situation in which this would make a difference?

Testing the existence of the property would result in false in the first case and true in the second case.

var x = {};
console.log('a exists', 'a' in x);

x.a = undefined;
console.log('a exists', 'a' in x);

The value of the property is irrelevant when testing for existence.

Similarly, getting all properties of an object would yield different results:

var x = {};
console.log(Object.keys(x));

x.a = undefined;
console.log(Object.keys(x));

3. If yes, how can I make that object go back to its initial state?

You can delete properties using the delete operator:

delete x.a;

Upvotes: 5

Pointy
Pointy

Reputation: 413702

JavaScript treats the setting of a property to any value as a meaningful thing. The in operator illustrates:

var x = {};
console.log("a" in x); // false
x.a = undefined;
console.log("a" in x); // true

The in operator is the solid way to test whether a particular key is present in an object regardless of value. There's also the Object.hasOwnProperty() function if it matters that the property be directly present on the object.

If you want to get rid of a property completely, you can use delete:

delete x.a;
console.log("a" in x); // false

The undefined "value" (is it really a value?) is essentially a wart on the design of JavaScript; it makes it such that the language has effectively two null values. I understand why it's there, but that doesn't make the situation any easier to deal with.

Upvotes: 2

Jim Cote
Jim Cote

Reputation: 1756

You can remove the key like so:

delete x.a;

Upvotes: 0

Related Questions