Thank you for printing our content at www.domain-name.com.

Please check back soon for new

contents.

(https://programiz.pro?utm_source=programiz-top-
CODING Try hands-on coding bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz PRO
36% OFF Claim Discount Now

Search tutorials & examples

(/)
www.domain-name.com

JavaScript Hoisting
In this tutorial, you will learn about JavaScript hoisting
with the help of examples.

Hoisting in JavaScript is a behavior in which a function or

a variable can be used before declaration. For example,

// using test before declaring

console.log(test); // undefined
var test;

Run Code (/javascript/online-compiler)

The above program works and the output will be

undefined . The above program behaves as

// using test before declaring

var test;
console.log(test); // undefined

Run Code (/javascript/online-compiler)

 Since the
Thank you for printing variable
our content test is only declared
at www.domain-name.com. and check
Please has noback soon for new
contents.
value, undefined value is assigned to it.
(https://programiz.pro?utm_source=programiz-top-
CODING TryIf you want
hands-on to learn more
coding about variables, visit JavaScript
bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz(/javascript/variables-constants).
Variables PRO
36% OFF Claim Discount Now

Note: In hoisting, though it seems that the

Search tutorials & examples
(/)
declaration has moved up in the program, the
www.domain-name.com
actual thing that happens is that the function and
variable declarations are added to memory during
the compile phase.

Variable Hoisting
In terms of variables and constants, keyword var is
hoisted and let and const does not allow hoisting.

For example,

// program to display value

a = 5;
console.log(a);
var a; // 5

Run Code (/javascript/online-compiler)

In the above example, variable a is used before

declaring it. And the program works and displays the
output 5 . The program behaves as:

// program to display value

var a;
a = 5;
console.log(a); // 5
Thank you for printing our content at www.domain-name.com. Please check back soon for new
Run Code (/javascript/online-compiler)
contents.

(https://programiz.pro?utm_source=programiz-top-
CODING Try hands-on coding bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz PRO
36% OFF Claim Discount Now
However in JavaScript, initializations are not hoisted. For
example,
Search tutorials & examples
(/)
www.domain-name.com
// program to display value
console.log(a);
var a = 5;

Run Code (/javascript/online-compiler)

Output

undefined

The above program behaves as:

var a;
console.log(a);
a = 5;

Run Code (/javascript/online-compiler)

Only the declaration is moved to the memory in the

compile phase. Hence, the value of variable a is
undefined because a is printed without initializing it.
Thank you for printing our content at www.domain-name.com. Please check back soon for new
contents.

(https://programiz.pro?utm_source=programiz-top-
CODING Try hands-on coding bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz PRO
36% OFF Claim Discount Now

Search tutorials & examples

(/)
Also, when the variable is used inside the function, the
www.domain-name.com
variable is hoisted only to the top of the function. For
example,

// program to display value

var a = 4;

function greet() {
b = 'hello';
console.log(b); // hello
var b;
}

greet(); // hello
console.log(b);

Run Code (/javascript/online-compiler)

Output

hello
Uncaught ReferenceError: b is not defined

In the above example, variable b is hoisted to the top of

the function greet and becomes a local variable. Hence
b is only accessible inside the function. b does not
become a global variable.

To learn more about local and global variables, visit

JavaScript Variable Scope
(https://www.programiz.com/javascript/variable-scope).
Thank you for printing our content at www.domain-name.com. Please check back soon for new
contents. Note: In hoisting, the variable declaration is only
accessible to the immediate scope.
(https://programiz.pro?utm_source=programiz-top-
CODING Try hands-on coding bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz PRO
36% OFF Claim Discount Now

If a variable is used
Search with the
tutorials let keyword, that variable is
& examples
(/)
not hoisted. For example,
www.domain-name.com

// program to display value

a = 5;
console.log(a);
let a; // error

Run Code (/javascript/online-compiler)

Output

Uncaught ReferenceError: Cannot access 'a' before initial

While using let , the variable must be declared first.

Function Hoisting
A function can be called before declaring it. For example,

// program to print the text

greet();

function greet() {
console.log('Hi, there.');
}

Run Code (/javascript/online-compiler)

Output
Thank you for printing our content at www.domain-name.com. Please check back soon for new
Hi, there
contents.

(https://programiz.pro?utm_source=programiz-top-
CODING TryIn the above
hands-on program, the function greet is called before
coding bar&utm_campaign=programiz&utm_medium=referral)
PRO declaring
with ProgramizitPRO
and the program shows the output. This is due
36% OFF Claim Discount Now
to hoisting.

Search tutorials & examples

(/)
www.domain-name.com
However, when a function is used as an expression, an
error occurs because only declarations are hoisted. For
example;

// program to print the text

greet();

let greet = function() {

console.log('Hi, there.');
}

Run Code (/javascript/online-compiler)

Output

Uncaught ReferenceError: greet is not defined

If var was used in the above program, the error would be:

Uncaught TypeError: greet is not a function

Note: Generally, hoisting is not performed in other

programming languages like Python, C, C++, Java.

Hoisting can cause undesirable outcomes in your

program. And it is best to declare variables and
functions first before using them and avoid
 hoisting.
Thank you for printing our content at www.domain-name.com. Please check back soon for new
contents.
In the case of variables, it is better to use let than
(https://programiz.pro?utm_source=programiz-top-
CODING var . coding
Try hands-on bar&utm_campaign=programiz&utm_medium=referral)
PRO with Programiz PRO
36% OFF Claim Discount Now

Search tutorials & examples

(/) Next Tutorial:
www.domain-name.com (/javascript/recursion)
JS Recursion

Previous Tutorial:
(/javascript/variable-scope)
JS Variable Scope

Share on:

(https://www.facebook.com/sharer/sharer.php? (https://twitter.com/in
u=https://www.programiz.com/javascript/hoisting) text=Check%20this%

Did you find this article helpful?

 Related
Thank you for printing Tutorials
our content at www.domain-name.com. Please check back soon for new
contents.
JavaScript Tutorial
(https://programiz.pro?utm_source=programiz-top-
CODING Try hands-on coding bar&utm_campaign=programiz&utm_medium=referral)
JavaScript let Vs var
PRO with Programiz PRO
36% OFF Claim Discount Now

Search tutorials & examples

(/javascript/let-vs-var)
(/)
JavaScript Tutorial www.domain-name.com

JavaScript Variable Scope

(/javascript/variable-scope)

JavaScript Tutorial

JavaScript Classes

(/javascript/classes)

JavaScript Tutorial

JavaScript Function and Function Expressions

(/javascript/function)