Comprendiendo la Anatomía de una Variable en JavaScript: Declaración y Diferencias
¿Qué es una Variable en JavaScript?
Una variable es un contenedor para almacenar datos que pueden ser utilizados y manipulados en un programa. Las variables permiten almacenar valores, que pueden ser de diferentes tipos, como números, cadenas de texto, objetos, arrays, funciones, etc.
Declaración de Variables en JavaScript
En JavaScript, hay tres formas principales de declarar variables: `var`, `let` y `const`. Cada una tiene sus propias características y reglas de alcance (scope).
var
// Declaración con var
var x = 10;
Características
Ámbito de Función: Las variables declaradas con `var` tienen un ámbito de función, lo que significa que si se declaran dentro de una función, solo son accesibles dentro de esa función.
Re-declaración Permitida: Puedes declarar la misma variable múltiples veces sin errores.
Hoisting: Las variables declaradas con `var` se «elevan» al inicio de su ámbito de función. Esto significa que puedes usar la variable antes de su declaración en el código.
Ejemplo de Ámbito de Función y Hoisting
function example() {
console.log(x); // undefined (hoisting)
var x = 5;
console.log(x); // 5
}
example();
let
Declaración
// Declaración con let
let y = 20;
Características
Ámbito de Bloque: Las variables declaradas con `let` tienen un ámbito de bloque, lo que significa que son accesibles solo dentro del bloque en el que se declaran (delimitado por `{}`).
No Re-declaración en el Mismo Ámbito: No puedes declarar la misma variable más de una vez en el mismo ámbito.
No Hoisting con Inicialización: Aunque las variables `let` se elevan, no se inicializan, por lo que usarlas antes de su declaración provoca un error de referencia.
Ejemplo de Ámbito de Bloque
if (true) {
let y = 10;
console.log(y); // 10
}
console.log(y); // ReferenceError: y is not defined
const
Declaración
// Declaración con const
const z = 30;
Características
Ámbito de Bloque: Igual que `let`, `const` tiene un ámbito de bloque.
Valor Constante: Una vez asignado un valor a una variable `const`, no puede ser reasignado.
No Re-declaración en el Mismo Ámbito: No puedes declarar la misma variable más de una vez en el mismo ámbito.
No Hoisting con Inicialización: Similar a `let`, las variables `const` también se elevan pero no se inicializan.
Ejemplo de `const`
const z = 10;
z = 20; // TypeError: Assignment to constant variable.
Comparaciones y Diferencias
1. Ámbito (Scope):
- `var`: Ámbito de función.
- `let` y `const`: Ámbito de bloque.
2. Hoisting:
- `var`: Se eleva y se inicializa como `undefined`.
- `let` y `const`: Se elevan pero no se inicializan, resultando en un error si se accede a ellas antes de la declaración.
3. Re-declaración:
- `var`: Permite re-declaración en el mismo ámbito.
- `let` y `const`: No permiten re-declaración en el mismo ámbito.
4. Asignación:
- `var` y `let`: Pueden ser reasignadas.
- `const`: No puede ser reasignada después de la inicialización.
Ejemplo Comparativo
function compare() {
// var
var a = 1;
var a = 2; // Permitido
console.log(a); // 2
// let
let b = 3;
// let b = 4; // SyntaxError: Identifier 'b' has already been declared
b = 4; // Permitido
console.log(b); // 4
// const
const c = 5;
// const c = 6; // SyntaxError: Identifier 'c' has already been declared
// c = 6; // TypeError: Assignment to constant variable.
console.log(c); // 5
}
compare();
Conclusión
Entender cómo declarar y usar variables en JavaScript es fundamental para escribir código eficiente y libre de errores. var
, let
y const
tienen sus propias características y se deben usar en diferentes contextos según el comportamiento deseado en cuanto a ámbito y mutabilidad.