{"id":9731,"date":"2013-03-01T19:10:30","date_gmt":"2013-03-01T13:40:30","guid":{"rendered":"http:\/\/www.tothenew.com\/blog\/?p=9731"},"modified":"2013-05-23T11:36:34","modified_gmt":"2013-05-23T06:06:34","slug":"difference-between-undefined-and-null-in-javascript","status":"publish","type":"post","link":"https:\/\/www.tothenew.com\/blog\/difference-between-undefined-and-null-in-javascript\/","title":{"rendered":"Difference Between \u2018null\u2019 and \u2018undefined\u2019 in JavaScript"},"content":{"rendered":"<p>Most people using JavaScript misunderstand the difference between \u2018null\u2019 and \u2018undefined\u2019. An unclear distinction between these two entities can lead to grave issues when using \u2018null\u2019 and \u2018undefined\u2019 in test cases.<\/p>\n<p>A variable is said to be \u2018undefined\u2019 if it has been declared, but no value has been given to it. Contrary to this, \u2018null\u2019 is a value that can be assigned to a variable and represents \u2018no value\u2019. Therefore, \u2018undefined\u2019 is a variable type whereas \u2018null\u2019 is an object value.<\/p>\n<p align=\"JUSTIFY\"><span style=\"color: #000000\">\u2018<span style=\"font-family: 'Times New Roman', serif\"><span style=\"font-size: medium\"><em><strong>Null\u2019 in JavaScript<\/strong><\/em><\/span><\/span><\/span><\/p>\n<p>\u2018Null\u2019 is a keyword in JavaScript that signifies \u2018no value\u2019 or nonexistence of any value. If you wish to shred a variable off its assigned value, you can simply assign \u2018null\u2019 to it. Besides this, like any other object, it is never implicitly assigned to a variable by JavaScript.<br \/>\nAn example of explicit null assignment is \u2013<\/p>\n<p>[js]var some_item= null;<br \/>\nconsole.log(some_item)[\/js]<\/p>\n<p>Upon execution, the code will print null.<\/p>\n<p align=\"JUSTIFY\"><span style=\"color: #000000\">\u2018<span style=\"font-family: 'Times New Roman', serif\"><span style=\"font-size: medium\"><em><strong>Undefined\u2019 in JavaScript<\/strong><\/em><\/span><\/span><\/span><\/p>\n<p>\u2018Undefined\u2019 is a global variable that JavaScript creates at run time. This global variable is assigned to an object in one of the following cases \u2013<\/p>\n<p>\t1. Declared but not defined \u2013<br \/>\nJavaScript assigns \u2018undefined\u2019 to any object that has been declared but not initialized or defined. In other words, in a case where no value has been explicitly assigned to the variable, JavaScript calls it \u2018undefined\u2019.<\/p>\n<p>\t2. Array index or object property that does not exist.<\/p>\n<p>\t3. A function parameter that has not been supplied.<\/p>\n<p>\t4. The return value of functions that have to but don\u2019t return a value.<\/p>\n<p>An illustration of this assignment is shown in the following \u2013<\/p>\n<p>[js]var item;<br \/>\nconsole.log(item)[\/js]<\/p>\n<p>Upon execution, the code will print undefined.<\/p>\n<p align=\"JUSTIFY\"><span style=\"color: #000000\"><span style=\"font-family: 'Times New Roman', serif\"><span style=\"font-size: medium\"><em><strong>Difference in Type \u2013 \u00a0<\/strong><\/em><\/span><\/span><\/span><\/p>\n<p>\u2018Null\u2019 is an object with a valid value, no properties, is non-mutable, and only a single instance of the same exists in the system at all times. In case you wish to verify the object nature of \u2018null\u2019, you can use the \u2018typeof\u2019 operator. The use of the same will give the output as \u2018object\u2019. However, if you use the \u2018typeof\u2019 operator on an object that belongs to one of the points mentioned in the \u2018undefined\u2019 list, you will get the object type as \u2018undefined\u2019.<\/p>\n<p align=\"JUSTIFY\"><span style=\"color: #000000\"><span style=\"font-family: 'Times New Roman', serif\"><span style=\"font-size: medium\"><em><strong>Conversion to Primitive Types &#8211;\u00a0<\/strong><\/em><\/span><\/span><\/span><\/p>\n<p>A major difference between \u2018null\u2019 and \u2018undefined\u2019 is in the way they are converted to primitive types. When you perform arithmetic conversion on \u2018null\u2019, the value determined is 0. This conversion can be verified using the following code snippet.<\/p>\n<p>[js]var v1= 5+ null;<br \/>\nconsole.log(v1)[\/js]<\/p>\n<p>Upon execution, this output of this code will print 5.<br \/>\nHowever, \u2018undefined\u2019 does not carry out any such conversion. If you try to add \u2018undefined\u2019 to a numeral, you will get NaN or Not-a-Number. The following code snippet illustrates this facet of \u2018undefined\u2019.<\/p>\n<p>[js]var v2= 5+ undefined;<br \/>\nconsole.log(v2)[\/js]<\/p>\n<p align=\"JUSTIFY\">\nUpon execution, the code will print NaN.<\/p>\n<p>Hope this will help. \ud83d\ude42<br \/>\nSakshi Tyagi<br \/>\nsakshi@intelligrape.com<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Most people using JavaScript misunderstand the difference between \u2018null\u2019 and \u2018undefined\u2019. An unclear distinction between these two entities can lead to grave issues when using \u2018null\u2019 and \u2018undefined\u2019 in test cases. A variable is said to be \u2018undefined\u2019 if it has been declared, but no value has been given to it. Contrary to this, \u2018null\u2019 [&hellip;]<\/p>\n","protected":false},"author":65,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":6},"categories":[1],"tags":[55,1142,1141],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/9731"}],"collection":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/users\/65"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/comments?post=9731"}],"version-history":[{"count":0,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/9731\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/media?parent=9731"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/categories?post=9731"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/tags?post=9731"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}