Pasar al contenido principal
Alexys Lozada
José Luján
Manuel Rodriguez
José Luján
Luis Avilés
Álvaro Felipe
José Luján
Beto Quiroga
Jonathan MirCha
Jonathan MirCha
Álvaro Felipe
Alexys Lozada, Álvaro Felipe, Jonathan MirCha
Beto Quiroga
Alexys Lozada
Alexys Lozada
José Luján
Álvaro Felipe
Álvaro Felipe
Jonathan MirCha
Jonathan MirCha
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Camilo Adobe
Álvaro Felipe
José Luján
Jonathan MirCha
Álvaro Felipe
Álvaro Felipe
Beto Quiroga, Alexys Lozada
Álvaro Felipe
Juan Villalvazo
Luis Avilés
Jonathan MirCha
Jonathan MirCha
Jonathan MirCha

Objetos Literales en JavaScript

objetos literales

Hola gente de EDteam, soy su amigo y docente digital Jonathan MirCha, siguiendo con la serie de artículos sobre el estándar actual de JavaScript hoy continuaré hablando de los objetos  literales.

JavaScript es un lenguaje basado en prototipos , por lo que todo es un objeto. Es un lenguaje obligatorio para proporcionar construcciones fáciles cuando se trata de crear objetos, configurar y acceder a prototipos.Los objetos literales nos permiten tener:

  • Atajos en la escritura de atributos y métodos.
  • Nombres de atributos y métodos calculados (o computados).

Atajos en la escritura de atributos y métodos

//Antes
var nombre = 'kEnAi',
  edad = 4;

var perro = {
  nombre : nombre,
  edad : edad,
  ladrar : function () {
    alert('guau guau!!!');
  }
};

console.log(perro); //Imprime Object {nombre: "kEnAi", edad: 4}
perro.ladrar(); //Manda alerta

//Ahora
let nombre = 'kEnAi',
  edad = 4;

const perro = {
  nombre,
  edad,
  ladrar() {
    alert('guau guau!!!');
  }
};

console.log(perro); //Imprime Object {nombre: "kEnAi", edad: 4}
perro.ladrar(); //Manda alerta

Como podemos ver en el código anterior, si el nombre de la variable que guarda el valor de la propiedad de un objeto, es igual al nombre de la propiedad misma, entonces se puede simplificar la asignación. También puedes observar que cuando a una propiedad se le asigna una función como valor, ya no es necesario declarar la estructura de una función, ahora simplemente asignamos el nombre del método seguido de los parentesis y las llaves del cuerpo de la función.

Nombres de atributos y métodos calculados (o computados)

let nombreAtributo = 'nombre',
  nombreOtroAtributo = 'ad',
  nombreMetodo = 'ladrar';

const perro = {
  [nombreAtributo] : 'kEnAi',
  [`ed${nombreOtroAtributo}`] : 4,
  [nombreMetodo]() {
    alert('guau guau!!!');
  }
};

console.log(perro); //Imprime Object {nombre: "kEnAi", edad: 4}
perro.ladrar(); //Manda alerta

Esto te pudiera parecer algo loco pero es muy similar al concepto de variables de variables en PHP. A veces es conveniente tener nombres de variables que se pueden definir y usar dinámicamente, tomando el valor de una variable y tratándolo como el nombre de otra variable, en este caso tomado la clave de la propiedad de nuestros objetos como puedes ver en el código anterior. Para realizar esto, es necesario declarar el nombre dinámico de la variable entre corchetes.

Como ves, gracias a los avances que el estándar de JavaScript ha tenido desde el 2015, ahora podemos tener una sintaxis con más posibilidades como en otros lenguajes de programación.

Recuerda que en EDteam tenemos varios cursos que te introducen y especializan en este maravilloso lenguaje:

En el siguiente capítulo te hablaré de la descomposición mejor conocida como destructuring.

Artículos anteriores de la serie 'El estándar actual de JavaScript':

  1. ECMAScript el estándar de JavaScript
  2. Babel
  3. Variables,Constantes y Niveles de Bloque
  4. Template Strings
  5. Arrow Functions

Se despide su amigo y docente digital Jonathan MirCha, sean felices, hasta siempre, nos leemos la próxima semana. Bye ?

Suscríbete al blog de EDteam

Ingresa tu correo electrónico para recibir nuestro boletín semanal