---
title: "Hoisting - Glossary | MDN"
chunk: 1/3
source: "https://developer.mozilla.org/en-US/docs/Glossary/Hoisting"
category: "reference"
tags: "web, html, css, javascript, documentation"
date_saved: "2026-05-05T05:34:01.449559+00:00"
instance: "kb-cron"
---

  * [Skip to main content](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting#content)
  * [Skip to search](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting#search)

[ MDN ](https://developer.mozilla.org/en-US/)
HTML
[HTML: Markup language](https://developer.mozilla.org/en-US/docs/Web/HTML) 

HTML reference
    
  * [Elements](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements)
  * [Global attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes)
  * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference "See all HTML references")

HTML guides
    
  * [Responsive images](https://developer.mozilla.org/en-US/docs/Web/HTML/Guides/Responsive_images)
  * [HTML cheatsheet](https://developer.mozilla.org/en-US/docs/Web/HTML/Guides/Cheatsheet)
  * [Date & time formats](https://developer.mozilla.org/en-US/docs/Web/HTML/Guides/Date_and_time_formats)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/HTML/Guides "See all HTML guides")

Markup languages
    
  * [SVG](https://developer.mozilla.org/en-US/docs/Web/SVG)
  * [MathML](https://developer.mozilla.org/en-US/docs/Web/MathML)
  * [XML](https://developer.mozilla.org/en-US/docs/Web/XML)

CSS
[CSS: Styling language](https://developer.mozilla.org/en-US/docs/Web/CSS) 

CSS reference
    
  * [Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties)
  * [Selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors)
  * [At-rules](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules)
  * [Values](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference "See all CSS references")

CSS guides
    
  * [Box model](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Box_model/Introduction)
  * [Animations](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Animations/Using)
  * [Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Flexible_box_layout/Basic_concepts)
  * [Colors](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Colors/Applying_color)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides "See all CSS guides")

Layout cookbook
    
  * [Column layouts](https://developer.mozilla.org/en-US/docs/Web/CSS/How_to/Layout_cookbook/Column_layouts)
  * [Centering an element](https://developer.mozilla.org/en-US/docs/Web/CSS/How_to/Layout_cookbook/Center_an_element)
  * [Card component](https://developer.mozilla.org/en-US/docs/Web/CSS/How_to/Layout_cookbook/Card)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/CSS/How_to/Layout_cookbook)

JavaScriptJS
[JavaScript: Scripting language](https://developer.mozilla.org/en-US/docs/Web/JavaScript) 

JS reference
    
  * [Standard built-in objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects)
  * [Expressions & operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators)
  * [Statements & declarations](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements)
  * [Functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference "See all JavaScript references")

JS guides
    
  * [Control flow & error handing](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling)
  * [Loops and iteration](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration)
  * [Working with objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_objects)
  * [Using classes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_classes)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide "See all JavaScript guides")

Web APIs
[Web APIs: Programming interfaces](https://developer.mozilla.org/en-US/docs/Web/API) 

Web API reference
    
  * [File system API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_API)
  * [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API)
  * [Geolocation API](https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API)
  * [HTML DOM API](https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API)
  * [Push API](https://developer.mozilla.org/en-US/docs/Web/API/Push_API)
  * [Service worker API](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web/API "See all Web API guides")

Web API guides
    
  * [Using the Web animation API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Using_the_Web_Animations_API)
  * [Using the Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)
  * [Working with the History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API/Working_with_the_History_API)
  * [Using the Web speech API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API/Using_the_Web_Speech_API)
  * [Using web workers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers)

All
[All web technology](https://developer.mozilla.org/en-US/docs/Web) 

Technologies
    
  * [Accessibility](https://developer.mozilla.org/en-US/docs/Web/Accessibility)
  * [HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP)
  * [URI](https://developer.mozilla.org/en-US/docs/Web/URI)
  * [Web extensions](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions)
  * [WebAssembly](https://developer.mozilla.org/en-US/docs/WebAssembly)
  * [WebDriver](https://developer.mozilla.org/en-US/docs/Web/WebDriver)
  * [See all…](https://developer.mozilla.org/en-US/docs/Web "See all web technology references")

Topics
    
  * [Media](https://developer.mozilla.org/en-US/docs/Web/Media)
  * [Performance](https://developer.mozilla.org/en-US/docs/Web/Performance)
  * [Privacy](https://developer.mozilla.org/en-US/docs/Web/Privacy)
  * [Security](https://developer.mozilla.org/en-US/docs/Web/Security)
  * [Progressive web apps](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps)

Learn
[Learn web development](https://developer.mozilla.org/en-US/docs/Learn_web_development) 

Frontend developer course
    
  * [Getting started modules](https://developer.mozilla.org/en-US/docs/Learn_web_development/Getting_started)
  * [Core modules](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core)
  * [MDN Curriculum](https://developer.mozilla.org/en-US/curriculum/)
  * [Check out the video course from Scrimba, our partner](https://scrimba.com/frontend-path-c0j?via=mdn-learn-navbar)

Learn HTML
    
  * [Structuring content with HTML module](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Structuring_content)

Learn CSS
    
  * [CSS styling basics module](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Styling_basics)
  * [CSS layout module](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/CSS_layout)

Learn JavaScript
    
  * [Dynamic scripting with JavaScript module](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Scripting)

Tools
Discover our tools 
  * [Playground](https://developer.mozilla.org/en-US/play)
  * [HTTP Observatory](https://developer.mozilla.org/en-US/observatory)

  * [Border-image generator](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Backgrounds_and_borders/Border-image_generator)
  * [Border-radius generator](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Backgrounds_and_borders/Border-radius_generator)
  * [Box-shadow generator](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Backgrounds_and_borders/Box-shadow_generator)
  * [Color format converter](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Colors/Color_format_converter)
  * [Color mixer](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Colors/Color_mixer)
  * [Shape generator](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Shapes/Shape_generator)

About
Get to know MDN better 
  * [About MDN](https://developer.mozilla.org/en-US/about)
  * [Advertise with us](https://developer.mozilla.org/en-US/advertising)

  * [Community](https://developer.mozilla.org/en-US/community)
  * [MDN on GitHub](https://github.com/mdn)

[Blog](https://developer.mozilla.org/en-US/blog/)
  1. [Glossary](https://developer.mozilla.org/en-US/docs/Glossary)
  2. [Hoisting](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting)

# Hoisting
JavaScript **Hoisting** refers to the process whereby the interpreter appears to move the _declaration_ of functions, variables, classes, or imports to the top of their [scope](https://developer.mozilla.org/en-US/docs/Glossary/Scope), prior to execution of the code.
_Hoisting_ is not a term normatively defined in the ECMAScript specification. The spec does define a group of declarations as [_HoistableDeclaration_](https://tc39.es/ecma262/multipage/ecmascript-language-statements-and-declarations.html#prod-HoistableDeclaration), but this only includes [`function`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function), [`function*`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*), [`async function`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function), and [`async function*`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function*) declarations. Hoisting is often considered a feature of [`var`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var) declarations as well, although in a different way. In colloquial terms, any of the following behaviors may be regarded as hoisting:
  1. Being able to use a variable's value in its scope before the line it is declared. ("Value hoisting")
  2. Being able to reference a variable in its scope before the line it is declared, without throwing a [`ReferenceError`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError), but the value is always [`undefined`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined). ("Declaration hoisting")
  3. The declaration of the variable causes behavior changes in its scope before the line in which it is declared.
  4. The side effects of a declaration are produced before evaluating the rest of the code that contains it.

The four function declarations above are hoisted with type 1 behavior; `var` declaration is hoisted with type 2 behavior; [`let`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let), [`const`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const), and [`class`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/class) declarations (also collectively called _lexical declarations_) are hoisted with type 3 behavior; [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) declarations are hoisted with type 1 and type 4 behavior.
Some prefer to see `let`, `const`, and `class` as non-hoisting, because the [temporal dead zone](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#temporal_dead_zone_tdz) strictly forbids any use of the variable before its declaration. This dissent is fine, since hoisting is not a universally-agreed term. However, the temporal dead zone can cause other observable changes in its scope, which suggests there's some form of hoisting:
If the `const x = 2` declaration is not hoisted at all (as in, it only comes into effect when it's executed), then the `console.log(x)` statement should be able to read the `x` value from the upper scope. However, because the `const` declaration still "taints" the entire scope it's defined in, the `console.log(x)` statement reads the `x` from the `const x = 2` declaration instead, which is not yet initialized, and throws a [`ReferenceError`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError). Still, it may be more useful to characterize lexical declarations as non-hoisting, because from a utilitarian perspective, the hoisting of these declarations doesn't bring any meaningful features.
Note that the following is not a form of hoisting:
There's no "access before declaration" here; it's simply because `var` declarations are not scoped to blocks.
For more information on hoisting, see:
  * `var`/`let`/`const` hoisting — [Grammar and types guide](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#variable_hoisting)
  * `function` hoisting — [Functions guide](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#function_hoisting)
  * `class` hoisting — [Classes guide](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_classes#class_declaration_hoisting)
  * `import` hoisting — [JavaScript modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#import_declarations_are_hoisted)

## In this article
  * [See also](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting#see_also)

##  [See also](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting#see_also)
  * [`var` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
  * [`let` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
  * [`const` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
  * [`function` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function)
  * [`class` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/class)
  * [`import` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)