{"id":882,"date":"2020-04-29T12:02:34","date_gmt":"2020-04-29T12:02:34","guid":{"rendered":"https:\/\/kalkus.dev\/?p=882"},"modified":"2023-08-24T23:32:20","modified_gmt":"2023-08-24T23:32:20","slug":"what-is-hoisting-in-javascript","status":"publish","type":"post","link":"https:\/\/kalkus.dev\/blog\/2020\/04\/29\/what-is-hoisting-in-javascript\/","title":{"rendered":"What is hoisting in JavaScript?"},"content":{"rendered":"\n<h3>What is hoisting is one of the standard JavaScript recruitment questions. For some devs it\u2019s one of the quirks of JavaScript, for others it allows understanding the language deeper. Let\u2019s take a look at the example:<\/h3>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">console.log(foo);  \/\/returns undefined not ReferenceError exception \nvar foo; <\/pre>\n\n\n\n<p>Console.log will not throw the exception. It will print undefined.<\/p>\n\n\n\n<h4>Why?<\/h4>\n\n\n\n<p>In most of the programming languages, we should have some \u2018variable undeclared\u2019 exception. In JavaScript, when the code is executed, the declarations of the variables (declared using var keyword, but not let!) and functions are hoisted, moved to the top (of the scope).<\/p>\n\n\n\n<p>Important thing to notice is that initializations are not hoisted.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">console.log(foo);  \/\/returns undefined  \nvar foo = \u201cbar\u201d; <\/pre>\n\n\n\n<h4>But why do we need it?<\/h4>\n\n\n\n<p>Well, if we need it or not is a good question, but let\u2019s take a look at the example of how hoisting can be useful. As I said before \u2013 declarations of functions are also moved up. Therefore we can use the function before it\u2019s declared:<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">sayHello(\"Mark\");\n\nfunction sayHello(name) {\n  console.log(\"Hello \" + name);\n}<\/pre>\n\n\n\n<p>To read more about the hoisting see: <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Glossary\/Hoisting\">https:\/\/developer.mozilla.org\/en-US\/docs\/Glossary\/Hoisting<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>What is hoisting is one of the standard JavaScript recruitment questions. For some devs it\u2019s one of the quirks of JavaScript, for others it allows understanding the language deeper. Let\u2019s take a look at the example: Console.log will not throw the exception. It will print undefined. Why? In most of the programming languages, we should [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[202,74],"tags":[29,125],"_links":{"self":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/882"}],"collection":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/comments?post=882"}],"version-history":[{"count":3,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/882\/revisions"}],"predecessor-version":[{"id":889,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/posts\/882\/revisions\/889"}],"wp:attachment":[{"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/media?parent=882"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/categories?post=882"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kalkus.dev\/blog\/wp-json\/wp\/v2\/tags?post=882"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}