Hoisting es un término para describir que las declaraciones de variables y funciones son desplazadas a la parte superior del scope más cercano, scope global o de función. Esto sucede solamente con las declaraciones y no con las asignaciones.

El código permanece igual, solo es una interpretación del motor de JavaScript. En el caso de las variables solamente sucede cuando son declaradas con var.

JavaScript cuando interpreta el código pasa las funciones y la declaración de las variables al inicio del scope (Por eso las variables se inicializan por defecto con undefined)

Las declaraciones se elevan pero solo las declaraciones, las funciones e imports se elevan por completo y las clases no sufren de hoisting.

Ejemplos

Hoisting con let y const

Aunque te haya dicho que el hoisting solo ocurre con declaraciones con var, no es totalmente cierto. El hoisting hará que el intérprete de JavaScript eleve las declaraciones con let y const a la Temporal Dead Zone.

La Temporal Dead Zone es una región del código donde la variable está declarada, pero no es posible acceder a esta, provocando un error de tipo ReferenceError.

console.log(nameVar) // undefined
console.log(nameLet) // ReferenceError: name Let is not defined

var nameVar = "myVar"
let nameLet = "myLet"

Buenas prácticas para usar hoisting

Material Extra

¿QUÉ ES EL HOISTING en JAVASCRIPT? | JS en ESPAÑOL