En ECMA Script 6 se pueden definir las variables de javascript con let y const, además de utilizar var. ¿Cual sería la recomendación para elegir que tipo de definición de variables debería utilizarse?
-
1asociación: http://stackoverflow.com/questions/762011/ – Rafael Bautista Mar 15 '19 at 06:58
2 Answers
Para responder a la pregunta:
¿Cual sería la recomendación para elegir que tipo de definición de variables debería utilizarse?
Primero se debe conocer cada tipo de sentencia y aclarar su alcance dentro de la ejecución de javascript:
La sentencia
let
declara una variable de alcance local, la cual, opcionalmente puede ser inicializada con algún valor.
Es decir, ejemplo:
(function(){
let foo = 'bar'; // Se crea y se le da un valor
let bar = 'foo'; // Se crea y se le da un valor
console.log('foo: ' + foo);
console.log('bar: ' + bar);
foo = 'foo'; // Se le asigna un nuevo valor
bar = 'bar'; // Se le asigna un nuevo valor
console.log('foo: ' + foo);
console.log('bar: ' + bar);
})()
console.log('foo: ' + foo); // foo is not defined
console.log('bar: ' + bar); // bar is not defined
En el ejemplo anterior se puede apreciar con claridad como las variables foo
y bar
solo pueden ser inicializadas, accedidas y cambiadas únicamente dentro del closure
pero no pueden ser accedidas y/o cambiadas por fuera de este...
NOTA: en el ejemplo anterior si se reemplaza a let
por var
se obtendrán los mismos resultados, solo lo puse como ejemplo, un mejor ejemplo sería decir que una variable let
definida en archivo_1.js
no podría ser accedida en archivo_2.js
mientras que una variable var
en archivo_1.js
si podría ser accedida y cambiada en archivo_2.js
Además hay que aclarar que las variables de tipo let
a diferencia de las variables de tipo var
NO PUEDEN
ser accedidas mediante el objeto global window
y tampoco pueden ser re declaradas a diferencia de las variables tipo var
, ejemplo:
var bar = 'foo';
let foo = 'bar';
console.log('bar: ' + bar);
console.log('window bar: ' + window.bar);
console.log('foo: ' + foo);
console.log('window foo: ' + window.foo); // undefined
var bar = 'new foo'; // bar puede ser RE DECLARADA
// let foo = 'new bar'; // foo NO PUEDE ser RE DECLARADA
console.log('bar: ' + bar);
console.log('window bar: ' + window.bar);
console.log('foo: ' + foo);
console.log('window foo: ' + window.foo); // undefined
La sentencia var es una simple declaración de una variable, opcionalmente inicializada a un valor.
Es decir:
var foo = 'bar';
console.log(foo);
console.log(window.foo);
foo = 'foo';
console.log(foo);
console.log(window.foo);
(function(){
console.log('closure foo: ' + foo);
console.log('closure window foo: ' + window.foo);
})()
La sentencia
const
es una constante que se presenta en un ámbito de bloque como lo hacen las variables de tipolet
pero que no puede ser cambiadas*(las propiedades de los objetos asignados a las constantes no están protegidas) ni redeclaradas
Al actuar como variables de tipo let
se debe tener en cuenta que tampoco pueden ser accededidas a través del objeto global window
, tampoco pueden ser re declaradas y/o re asignadas con un nuevo valor
const KEY = '0123456780';
console.log(KEY);
console.log(window.KEY); // undefined
// KEY = '0876543210'; // KEY' has already been declared
// const KEY = '0876543210'; // KEY' has already been declared
console.log(KEY);
console.log(window.KEY); // undefined
const data = {
id : 1,
name : "top secret"
}
console.log(data)
data.id = 9 //the reference does not change it
data.name = "Nine";
console.log(data)
Por último y como conclusión quedarían algunas recomendaciones como:
1. Usa variables de tipo let
dentro de funciones, ciclos y demás bloques de código que su ejecución sea local, no dependa de otro código y donde dichas variables no tengan porque ser accedidas de manera global mediante el objeto window
2. Usa variables de tipo var
donde dicha variable tenga que ser accedida en otros bloques de código y de manera global mediante el objeto window
, es decir: var jq = $;
3. Usa CONSTANTES (const
) para información como lo puede ser una API KEY, un TOKEN, un valor que SIEMPRE TENGA QUE SER EL MISMO, es decir: const my_credit_card_number = 1234567890;
NOTA: solo haz el ejemplo anterior si estás en nodejs
, jaja
- 6,836
- 5
- 22
- 49
- 6,109
- 9
- 28
- 55
-
1En el ejemplo del closure `var` y `let` tienen el mismo efecto. – Jose Hermosilla Rodrigo Mar 17 '17 at 19:02
-
1@JoseHermosillaRodrigo tienes razón, estoy editando aún mi pregunta, de todas maneras quería poner un ejemplo y me pareció sencillo utilizar un closure para ello, gracias por la observación – Jorius Mar 17 '17 at 19:05
-
De nada!! Eso de que no se puedan acceder mediante window si que me parece interesante. No lo sabía. Saludos!! – Jose Hermosilla Rodrigo Mar 17 '17 at 19:15
-
@JoseHermosillaRodrigo Añadí una breve nota a la descripción del ejemplo para que sea más claro todo – Jorius Mar 17 '17 at 19:16
-
1@Jorius las variables `let` no pueden ser redeclaradas como lo hace `var` – JuankGlezz Mar 17 '17 at 19:16
-
@JuankGlezz ¿Redeclarar y asignar un nuevo valor es lo mismo? *legit question* – Jorius Mar 17 '17 at 19:20
-
@Jorius lo que me refiero es que no puedes poner `var variable = 0` y en la siguiente linea u otras más abajo poner `let variable = 1`, aquí es donde me confundí un poco _como lo hace `var`_ – JuankGlezz Mar 17 '17 at 19:30
-
@JuankGlezz He actualizado mi respuesta aclarando lo de el redeclaramiento – Jorius Mar 17 '17 at 23:24
La diferencia entre let
y var
más importante es el alcance (o scope).
var hará que estén definidas las variables dentro de la función más cercana.
let hará solo está definido en el bloque cerrado más cercano. A parte var declara las variables en la parte superior de la función más cercana sin importar donde la declaremos, lo que se conoce como hoisting (+info).
let
tampoco permite que creemos una variable con el mismo nombre, aunque si permite modificarla (al contrario que const
). Digamos que const
tiene el mismo efecto que let
con la diferencia de que no podemos modificar el valor primitivo que almacene. Si que podríamos modificar las propiedades de un objeto con const
.
//console.log(letvariable); //--> esto da error
console.log(varvariable); // undefined -> Esto no ya que var hace que estén visibles en su función más próxima
let letvariable = '';
var varvariable = '';
// De igual forma
(function(){
//console.log(x); // -> error
console.log(y); // undefined
let x = 'x';
var y = 'y'
})()
for(let a = 0; a < 9; a++){
}
//console.log(a); // a no esta definida
for(var b = 0; b < 9; b++){
}
console.log(b);
{
let c = 'hello';
var d = 'hello';
}
//console.log(c) // error
console.log(d);
let xx = '';
//let xx = 'xx'; //-> error
var yy = '';
var yy = 'aaaa';
console.log(yy);
const zz = 'aa';
//zz = 'bb'; // error
const objeto = {};
objeto.a = 'aa';
console.log(objeto);
Teniendo en cuenta esto, el uso de una o de otra depende de la funcionalidad que quieras tener en tu programa.
- 3,805
- 1
- 15
- 24