js-javascript-logo

Hoisting

By @squizzleflip

Understanding hoisting will help you organize your function scope. Just remember, variable declarations and function definitions are hoisted to the top. Variable definitions are not, even if you declare and define a variable on the same line. Also, a variable declaration lets the system know that the variable exists while definition assigns it a value.

function doTheThing() {
 // ReferenceError: notDeclared is not defined
 console.log(notDeclared);
 // Outputs: undefined
 console.log(definedLater);
 var definedLater;
 definedLater = 'I am defined!'
 // Outputs: 'I am defined!'
 console.log(definedLater)
 // Outputs: undefined
 console.log(definedSimulateneously);
 var definedSimulateneously = 'I am defined!'
 // Outputs: 'I am defined!'
 console.log(definedSimulateneously)
 // Outputs: 'I did it!'
 doSomethingElse();
 function doSomethingElse(){
 console.log('I did it!');
 }
 // TypeError: undefined is not a function
 functionVar();
 var functionVar = function(){
 console.log('I did it!');
 }
}

To make things easier to read, declare all of your variables at the top of your function scope so it is clear which scope the variables are coming from. Define your variables before you need to use them. Define your functions at the bottom of your scope to keep them out of your way.

  • js-javascript-share
  • js-javascript-share-twitter
  • js-javascript-share-facebook
  • js-javascript-share-linkedin
jstips book
MEET THE NEW JSTIPS BOOK You no longer need 10+ years of experience to get your dream job.

Use the 100 answers in this short book to boost your confidence and skills to ace the interviews at your favorite companies like Twitter, Google and Netflix.

GET THE BOOK NOW jstips amazon
jstips book
MEET THE NEW JSTIPS BOOK The book to ace the JavaScript Interview.

A short book with 100 answers designed to boost your knowledge and help you ace the technical interview within a few days.

GET THE BOOK NOW jstips amazon

Related tips

Please enable JavaScript to view the comments powered by Disqus.

AltStyle によって変換されたページ (->オリジナル) /