javascript tutorial - [Solved-5 Solutions] Difference between null and undefined in javascript - javascript - java script - javascript array



Problem:

We want to know what the difference is between null and undefined in JavaScript.

Solution 1:

In JavaScript, undefined means a variable has been declared but has not yet been assigned a value, such as:

var TestVar;
 alert(TestVar); //shows undefined
 alert(typeof TestVar); //shows undefined
click below button to copy the code. By JavaScript tutorial team

null is an assignment value. It can be assigned to a variable as a representation of no value:

 var TestVar = null;
 alert(TestVar); //shows null
 alert(typeof TestVar); //shows object
click below button to copy the code. By JavaScript tutorial team

From the preceding examples, it is clear that undefined and null are two distinct types: undefined is a type itself (undefined) while null is an object.

 null === undefined // false
 null == undefined // true
 null === null // true
click below button to copy the code. By JavaScript tutorial team

and

 null = 'value' // ReferenceError
 undefined = 'value' // 'value'

click below button to copy the code. By JavaScript tutorial team

Solution 2:

null: absence of value for a variable; undefined: absence of variable itself; ..where variable is a symbolic name associated with a value. JS could be kind enough to implicitly init newly declared variables with null, but it does not.

Solution 3:

Undefined means a variable has been declared but has no value:

var var1;
alert(var1); //undefined
alert(typeof var1); //undefined
click below button to copy the code. By JavaScript tutorial team

Null is an assignment:

var var2= null;
alert(var2); //null
alert(typeof var2); //object
click below button to copy the code. By JavaScript tutorial team

Solution 4:

null and undefined are two distinct object types which have the following in common:

  • both can only hold a single value, null and undefined respectively;
  • both have no properties or methods and an attempt to read any properties of either will result in a run-time error (for all other objects, we get value undefined if we try to read a non-existent property);
  • values null and undefined are considered equal to each other and to nothing else by == and != operators.

The similarities however end here. For once, there is a fundamental difference in the way how keywords null and undefined are implemented. This is not obvious, but consider the following example:

var undefined = "foo";
WScript.Echo(undefined); // This will print: foo
click below button to copy the code. By JavaScript tutorial team

undefined, NaN and Infinity are just names of preinitialized "superglobal" variables - they are initialized at run-time and can be overridden by normal global or local variable with the same names. Now, let's try the same thing with null:

var null = "foo"; // This will cause a compile-time error
WScript.Echo(null);
click below button to copy the code. By JavaScript tutorial team

Oops! null, true and false are reserved keywords - compiler won't let we use them as variable or property names Another difference is that undefined is a primitive type, while null is an object type (indicating the absense of an object reference). Consider the following:

WScript.Echo(typeof false); // Will print: boolean
WScript.Echo(typeof 0); // Will print: number
WScript.Echo(typeof ""); // Will print: string
WScript.Echo(typeof {}); // Will print: object
WScript.Echo(typeof undefined); // Will print: undefined
WScript.Echo(typeof null); // (!!!) Will print: object
click below button to copy the code. By JavaScript tutorial team

Also, there is an important difference in the way null and undefined are treated in numeric context:

var a; // declared but uninitialized variables hold the value undefined
WScript.Echo(a === undefined); // Prints: -1

var b = null; // the value null must be explicitly assigned
WScript.Echo(b === null); // Prints: -1

WScript.Echo(a == b); // Prints: -1 (as expected)
WScript.Echo(a >= b); // Prints: 0 (WTF!?)

WScript.Echo(a >= a); // Prints: 0 (!!!???)
WScript.Echo(isNaN(a)); // Prints: -1 (a evaluates to NaN!)
WScript.Echo(1*a); // Prints: -1.#IND (in Echo output this means NaN)

WScript.Echo(b >= b); // Prints: -1 (as expected)
WScript.Echo(isNaN(b)); // Prints: 0 (b evaluates to a valid number)
WScript.Echo(1*b); // Prints: 0 (b evaluates to 0)

WScript.Echo(a >= 0 && a <= 0); // Prints: 0 (as expected)
WScript.Echo(a == 0); // Prints: 0 (as expected)
WScript.Echo(b >= 0 && b <= 0); // Prints: -1 (as expected)
WScript.Echo(b == 0); // Prints: 0 (!!!)
click below button to copy the code. By JavaScript tutorial team

null becomes 0 when used in arithmetic expressions or numeric comparisons - similarly to false, it is basically just a special kind of "zero". undefined, on the other hand, is a true "nothing" and becomes NaN ("not a number") when we try to use it in numeric context. Note that null and undefined receive a special treatment from == and != operators, but we can test true numeric equality of a and b with the expression (a >= b && a <= b).

Solution 5:

In JavasSript there are 5 primitive data types String , Number , Boolean , null and undefined. WE will try to explain with some simple example lets say we have a simple function

 function test(a) {

     if(a == null){
        alert("a is null");
     } else {
        alert("The value of a is " + a);
     }
  }
click below button to copy the code. By JavaScript tutorial team

also in above function if(a == null) is same as if(!a) now when we call this function without passing the parameter a

   test(); it will alert "a is null";
   test(4); it will alert "The value of a is " + 4;
click below button to copy the code. By JavaScript tutorial team

also

var a;
alert(typeof a); 
click below button to copy the code. By JavaScript tutorial team

this will give undefined; we have declared a variable but we have not asigned any value to this variable; but if we write

var a = null;
alert(typeof a); will give alert as object
click below button to copy the code. By JavaScript tutorial team

so null is an object. in a way we have assigned a value null to 'a'


Related Searches to javascript tutorial - Difference between null and undefined in javascript