Function hoisting behavior in Javascript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is function hoisting in JavaScript?

Function hoisting means JavaScript moves function declarations to the top of their scope before code runs, so you can call functions before they appear in the code.

intermediate

How does hoisting differ between function declarations and function expressions?

Function declarations are fully hoisted, so you can call them before they appear. Function expressions are not hoisted the same way; if assigned to a variable, only the variable declaration is hoisted, not the assignment.

beginner

What happens if you call a function expression before it is defined?

If you call a function expression before it is assigned, you get a TypeError because the variable is hoisted but undefined at that point.

beginner

Example: What will this code output?
<pre>console.log(greet());
function greet() { return 'Hello!'; }</pre>

It will output 'Hello!' because the function declaration 'greet' is hoisted, so it exists before the console.log runs.

intermediate

Example: What will this code output?

console.log(sayHi());
var sayHi = function() { return 'Hi!'; };

It will cause a TypeError because 'sayHi' is hoisted as a variable but is undefined when called, so you cannot call it as a function yet.

What does function hoisting allow you to do in JavaScript?

A Prevent functions from being overwritten

B Use variables before declaring them

C Call functions before they are declared

D Automatically run functions on page load

Function hoisting moves function declarations to the top, so you can call them before their code appears.

Which of these is fully hoisted in JavaScript?

A Function declaration

B Function expression assigned to var

C Arrow function assigned to let

D Class declaration

Function declarations are fully hoisted with their body; function expressions and arrow functions are not.

What error occurs if you call a function expression before it is assigned?

A ReferenceError

B TypeError

C SyntaxError

D No error

Calling an undefined variable as a function causes a TypeError.

Given this code, what will happen?

console.log(foo());
var foo = function() { return 'bar'; };

A 'bar' is printed

B undefined is printed

C ReferenceError: foo is not defined

D TypeError: foo is not a function

Variable 'foo' is hoisted but undefined at the call, so calling it causes a TypeError.

Which statement about function hoisting is true?

A Only function declarations are hoisted, not function expressions

B Both function declarations and expressions are fully hoisted

C Function expressions are hoisted before declarations

D Hoisting only applies to variables

Only function declarations are fully hoisted; function expressions are not.

Explain function hoisting and how it affects calling functions before their definition.

Think about what JavaScript does before running your code.

Describe the difference in hoisting behavior between a function declaration and a function expression assigned to a variable.

Consider what happens to the variable and the function code separately.