33

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?

dwarandae
  • 2,459
  • 6
  • 18
  • 41
Pablo Ezequiel Inchausti
  • 1,218
  • 3
  • 18
  • 28

2 Answers2

29

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 tipo let 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

JackNavaRow
  • 6,836
  • 5
  • 22
  • 49
Jorius
  • 6,109
  • 9
  • 28
  • 55
8

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.

Jose Hermosilla Rodrigo
  • 3,805
  • 1
  • 15
  • 24