Hoisting

As of late I have put my application in to several companies as a front-end engineer. During my interview processes at these different companies I feel that I have gained a lot of valuable knowledge. Even if I wasn't offered the position, I have been able to take away some important information as well as prepare myself for future interviews.

I just recently interviewed for a company that was a bit out of my level of skill so I was unfortunately not offered the position but as I said before I have taken some valuable information from the process.

Like most JavaScript developers coming from other languages I have had some challenges wrapping my head around some of the "quirks" that make JavaScript a great language. One of these quirks includes understanding function-based scope vs. block-based scope. With this topic comes something new that I took from a recent interview which is hoisting. So because of my misunderstanding of how or what hoisting was I did some research. Here is my understanding of it thus far:

function foo() {
  bar()
  baz()
  var bar = function() {
    console.log('Hello')
  }
  function baz() {
    console.log('World')
  }
}

foo()

So basically what happens here is that the assignments are hoisted to the top of the foo() function. Because of this the bar() function will not be able to execute because it will be undefined.

For some this may serve as review but I hope it may help newcomers understand how things are executed.

Happy Coding!