As we know, variables in JS are the named memory locations. We use different ways to define a variable and sometimes we don\u2019t assign any value to the variable, which is called undefined variables. In this article, we will look into various methods to check if a Variable is Undefined in JavaScript or not. Let us get started!<\/p>\n\n\n\n
Undefined, in general terms, means \u201cnot-defined\u201d. An undefined variable in JavaScript refers to a variable that has been declared but has not been assigned any value. <\/strong>When a variable is not assigned any value, it holds a garbage value. Undefined variables can also occur when we try to access the invalid index of an array.\u00a0<\/p>\n\n\n\n Let us see a few examples of the same.\u00a0 Look at the code below:\u00a0<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n In this example, we have declared a variable \u201cnum\u201d, but we have not assigned any value to the variable, so \u201cnum\u201d does not hold a defined value. Hence, the output is undefined. We have obtained the desired output.\u00a0<\/p>\n\n\n\n Let us see another example where an undefined value can occur:<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n In this example, we are trying to access the value at a non-existent index of an array. The array’s length is 6 and the indexing starts from zero(0). So, the index of the last element of the array is Five (5). Therefore, accessing any index greater than five will give us an undefined value. Hence, we have got the desired output.\u00a0<\/p>\n\n\n\n Let us take another example of an object:<\/p>\n\n\n\n Output<\/strong><\/p>\n\n\n\n In this example, we have an object with two key-value pairs. The values can be accessed with the help of the keys. The keys are name and age. There\u2019s no key \u201cincome\u201d. Hence, when we try to access the value corresponding to a non-existent key (like income), the outcome is an undefined value. Hence, we have obtained the desired result. <\/p>\n\n\n\n Note that it is different than null. In JavaScript, “undefined” indicates that a variable has been declared without assigning a value or that a property does not exist in an object. On the other hand, “null” represents the intentional absence of any object value.<\/p>\n\n\n\n In this section, we will look into various methods to check if a variable has an undefined value:\u00a0<\/p>\n\n\n\n One of the most simple methods to check if a variable is undefined is through direct comparison. We compare the value of the variable to the undefined keyword. By this, we determine if the variable is undefined or not.\u00a0<\/strong><\/p>\n\n\n\n Let us see an example to do it practically:<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n We directly compare the value that the variable holds with the undefined keyword. The \u201cif\u201d condition is true and hence we have obtained the desired result.<\/p>\n\n\n\n The typeof operator is used to check the type of any variable. So, using typeof will also help us identify if the variable holds an undefined value or not. <\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n We have used the typeof operator to check if the variable is defined or not. It returns the type as undefined. Hence, we have obtained the desired result. <\/p>\n\n\n\n The void operator is another method to check if a variable is undefined. The void operator evaluates an expression and returns undefined as its result.\u00a0<\/strong>Check the code below:<\/p>\n\n\n\n Output<\/strong><\/p>\n\n\n\n We compare the variable with the void 0 operator. If they are the same, then the variable is undefined. Hence, we have obtained the desired result. <\/p>\n\n\n\n Functions may or may not use parameters. When functions have parameters, we have to make sure to check for the undefined value.\u00a0Let us see an example:<\/p>\n\n\n\n Output:<\/strong><\/p>\n\n\n\n In this, we handle the undefined parameter in the function by using an \u201cif\u201d condition. If the parameter is undefined, \u201cHello World\u201d gets printed. If the parameter is not undefined, we print the statement as \u201cHello [planetName]\u201d. We first use the undefined parameter and print \u201cHello World!\u201d. Then we assign the value \u201cEarth\u201d to the planet variable and print \u201cHello Earth!\u201d. <\/p>\n\n\n\n We have obtained the desired result.\u00a0<\/p>\n\n\n\n In JavaScript, It is essential to understand how to check for undefined variables to write robust and clean code. In this article, we first discussed various cases where it can occur. We can use the above-discussed methods such as direct comparison, typeof Operator, or Void Operator to check it. If you have any more doubts, get our expert-level JavaScript homework help<\/a> instantly.<\/p>\n","protected":false},"excerpt":{"rendered":" Understand what are undefined variables and how to check for undefined in JavaScript using various methods.<\/p>\n","protected":false},"author":9,"featured_media":1195,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jnews-multi-image_gallery":[],"jnews_single_post":null,"jnews_primary_category":{"id":"","hide":""},"footnotes":""},"categories":[9],"tags":[11],"class_list":["post-1193","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-development","tag-javascript"],"_links":{"self":[{"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/posts\/1193","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/comments?post=1193"}],"version-history":[{"count":3,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/posts\/1193\/revisions"}],"predecessor-version":[{"id":1246,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/posts\/1193\/revisions\/1246"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/media\/1195"}],"wp:attachment":[{"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/media?parent=1193"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/categories?post=1193"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/favtutor.com\/articles\/wp-json\/wp\/v2\/tags?post=1193"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}\/\/declaring a variable\nlet num;\n\n\/\/printing the variable num\nconsole.log(num);<\/pre><\/div>\n\n\n\n
undefined<\/code><\/pre>\n\n\n\n\/\/declaring an array\nlet arr=[1,2,3,4,5,6];\n\n\/\/printing the 6th index value of array\nconsole.log(arr[6]);<\/pre><\/div>\n\n\n\n
undefined<\/code><\/pre>\n\n\n\n\/\/declaring an object\nlet obj={\n name: "Rachel",\n age: 17\n}\n\n\/\/accessing non existent key in the object \nconsole.log(obj.income);<\/pre><\/div>\n\n\n\nundefined<\/code><\/pre>\n\n\n\n3 Ways to Check for Undefined in JavaScript<\/strong><\/h2>\n\n\n\n
1.) Direct Comparison<\/strong><\/h3>\n\n\n\n
\/\/declaring a variable\nlet num;\n\n\/\/checking for the undefined value\nif(num==undefined){\n console.log("The variable holds an undefined value.");\n}\nelse{\n console.log("The variable does not hold an undefined value.");\n}<\/pre><\/div>\n\n\n\nThe variable holds an undefined value.<\/code><\/pre>\n\n\n\n2) Using the typeof Operator<\/strong><\/h3>\n\n\n\n
\/\/declaring a variable\nlet num;\n\n\/\/using the typeof operator\nconsole.log(typeof(num));<\/pre><\/div>\n\n\n\n
undefined<\/code><\/pre>\n\n\n\n3) Using the Void Operator<\/strong><\/h3>\n\n\n\n
\/\/declaring a variable\nlet num;\n\n\/\/using the void operator\nif(num==void 0){\n console.log("The variable num is undefined.");\n}\nelse{\n console.log("The variable num holds a defined value.");\n}<\/pre><\/div>\n\n\n\nThe variable num is undefined.<\/code><\/pre>\n\n\n\nHandling undefined Variables in Functions<\/strong><\/h2>\n\n\n\n
\/\/declaring a function\nfunction sayHello(planetName){\n \/\/direct comparison with keyword\n if(planetName==undefined){\n console.log("Hello World!");\n }\n else{\n console.log("Hello "+planetName+"!");\n }\n}\n\n\/\/declaring planet variable\nlet planet;\n\n\/\/calling the function\nsayHello(planet);\n\n\/\/assigning a value to the planet variable\nplanet="Earth";\n\n\/\/calling the function again\nsayHello(planet);<\/pre><\/div>\n\n\n\nHello World!\nHello Earth!\n<\/code><\/pre>\n\n\n\nConclusion<\/strong><\/h2>\n\n\n\n