When JavaScript returns null & undefined?

Question

I have been using JavaScript for couple of years and never cared about the difference between null & undefined earlier, I always use undefined to validate the object existence.

But recently I came through this article. Here they said

JavaScript distinguishes between null, which is an object of type 'object' that indicates a deliberate non-value, and undefined, which is an object of type 'undefined' that indicates an uninitialized value — that is, a value hasn't even been assigned yet. We'll talk about variables later, but in JavaScript it is possible to declare a variable without assigning a value to it. If you do this, the variable's type is undefined.

I am completely confused now, what exactly is non-value here. How this non-value differs from undefined. And what are the circumstances javascript returns null.

I have tried the below sample

var sam;
alert(sam);  // returns undefined

And

try {
    //var sam;
    alert(sam);  
} catch(ex) { }   // exception says: sam is undefined

And I am not sure about when js returning nulls. Can someone clarify me.

Solution 1

alert(sam); // returns undefined

Nope, that's an exception.

You get undefined when you access an unset property; you get an error when you use an unset name directly.

Global variables are interesting because they can be accessed either using a simple variable name, or by using properties of the window global object:

alert(window.sam);      // undefined
alert(window['sam']);   // undefined
alert('sam' in window); // false
alert(sam);             // ERROR

If sam is declared but not initialised, accessing window.sam still gets you undefined, but for a different reason: there is an entry in the window object for sam, but it points to the same undefined object as you get when you access a non-existant property.

var sam;
alert(window.sam);      // undefined
alert(window['sam']);   // undefined
alert('sam' in window); // ** true
alert(sam);             // ** undefined

This is of course a confusing bloody mess; undefined is one of the worst mistakes in the design of the JavaScript language.

null on the other hand is fine and works pretty much the same as null/nil/void/None values in other languages. It doesn't come into any of the above.

Solution 2

<script type="text/javascript">
// variable with an unasigned value
var a;
if (a == undefined) {
  alert('a is undefined');
}

if (a == null) {
  alert('a is undefined');
}

// this will produce an error
if (b == undefined) {
  alert('b is undefined');
}

// this is the right way to handle not defined variables
if (typeof(c) == 'undefined') {
  alert('c is blabla');
}
</script>

Solution 3

For a variable to receive a null value it must be assigned. null is used to indicate an unknown or don't care value. undefined on the other hand is designed to indicate that the propery being accessed has never ben assigned a value. This differs from null.

With null one is deliberately saying "I don't know what value this should have yet" or "I don't care what value this is right now". OTH in undefined is really saying "Are you sure you should be using this value it hasn't been assigned".

Solution 4

The way I distinguish them is undefined being "I have not defined this value," and null being "I have defined this value, but I do not know or cannot figure out what the value should be."

View more solutions