Zona Muerta Temporal de variables

En este artículo, discutiré sobre este término genial (juego de palabras) que se usa a menudo en chismes y entrevistas de Javascript. Para comprender TDZ , uno debe tener una comprensión general del concepto de elevación de Javascript. Una vez más, ¿qué significa ese Hoisting ? Déjame guiarte a través de un código simple,

console.log(a)
showNumber()

function showNumber() {
  console.log(7)
}
var a = 5

Esperar ! ¿De dónde viene eso indefinido?

Cada vez que se ejecuta un programa javascript, la memoria para todas las variables y funciones se asigna primero. La memoria reservada contiene el valor indefinido para las variables y el código de función como en el caso de las funciones. Los valores en el espacio de memoria para la variable a y la función showNumber en la imagen a continuación son del tiempo exacto de la fase cuando nuestro código comienza a ejecutarse de verdad después de completar la fase de asignación de memoria.

Ahora podemos decir que Javascript inicializa nuestras variables con esa palabra clave especial indefinida incluso antes de que la inicialicemos en el código. Este comportamiento especial de Javascript se conoce como Hoisting, y debido al Hoisting de variables y funciones, podemos invocarlas antes de su inicialización sin ningún error.

Izado de Let y Const

Acabamos de cubrir cómo funciona la elevación con las variables declaradas con Var. Pero como ya sabe, la forma más popular y eficiente de declarar variables después de ES6 es con las palabras clave let y const . Profundicemos un poco más para comprender cómo funciona la elevación para ellos, por supuesto, con el código simple a continuación.

console.log(a)
let a = 5

Nuestra consola no está contenta esta vez con lo que acabamos de hacer. Cuando se ejecuta el código anterior, se rompe porque violamos la regla de javascript al intentar acceder a una variable declarada con la palabra clave let antes de su inicialización completa. Vamos a ver lo que tenemos,

A diferencia de var, las variables declaradas con let y const no se inicializan antes de su declaración durante el levantamiento y, por lo tanto, no se puede acceder a ellas. Esta área exacta del código, donde no podemos acceder a dichas variables, se conoce como zona muerta temporal.

Cambiemos un poco las cosas,

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

No sorprende esta vez, porque ya hemos declarado y ahora está disponible para que lo usemos. El valor todavía parece ser ( indefinido) lo que obtuvo durante el izado de la variable a porque aún no lo hemos inicializado (hasta la segunda línea) en nuestro código. Cuando el código continúa, el valor de a ie indefinido se reemplaza por lo que lo inicializamos (5 en el caso anterior). En este caso, la zona muerta temporal de la variable a finaliza ( durante la elevación porque javascript lo inicializa con indefinido ) como tan pronto como comience, ya que está disponible en la parte superior de nuestro código con el valor indefinido (hasta que lo inicialicemos explícitamente) para usar.

El mismo concepto de TDZ y Hoisting con let se aplica también a las variables declaradas con const , además de sus diferencias.

Conclusión

La zona muerta temporal es simplemente el área de código donde la variable declarada con let y const son inaccesibles. Cualquier desarrollador que no esté de acuerdo con el concepto de zona muerta temporal puede romper cosas y tener dificultades para depurar. Siempre inicializar un valor con declaración de variable es el mejor enfoque que puede tomar para evitar la zona muerta temporal y sus consecuencias.

Que tenga un buen día !