3 métodos muy útiles para objetos en Javascript

Cristian Fernando - May 21 '21 - - Dev Community

Índice

  1. Introducción
  2. Object.keys()
  3. Object.values()
  4. Object.entries()
  5. Referencias
  6. Conclusiones

1.Introducción

Los objetos como bien sabemos todos son una de las piedras angulares en JavaScript, a diferencia de los arreglos donde tenemos a nuestra disposición gran cantidad de métodos, en los objetos esta cantidad es reducida, a mi criterio 3 de estos sobresalen y es importante comprenderlos:

2.Object.keys()

Object.keys() recibe un objeto como entrada y regresa un array con todas las llaves de dicho objeto.

Sintaxis

Object.keys(objeto)
Enter fullscreen mode Exit fullscreen mode

Por ejemplo:

const persona = {
  nombre: "Eduardo",
  edad:15,
  soltero: true
}

console.log(Object.keys(persona));
//salida:["nombre", "edad", "soltero"]
Enter fullscreen mode Exit fullscreen mode

Puede ser útil para verificar si un objeto está vacío o no:

const persona = {

}

console.log( (Object.keys(persona).length === 0) ? "esta vacio" : "no esta vacio" )
//salida: "esta vacio"
Enter fullscreen mode Exit fullscreen mode

3.Object.values()

Object.values() recibe un objeto como parámetro y regresa un arreglo que contiene todos los valores del objeto.

Sintaxis

Object.values(objeto)
Enter fullscreen mode Exit fullscreen mode

Por ejemplo:

const persona = {
   nombre:"Camila",
   edad:23,
   soltera: false
}

console.info(Object.values(persona));
//salida: ["Camila", 23, false]
Enter fullscreen mode Exit fullscreen mode

4.Object.entries()

Object.entries() es como una fusión de Object.keys() y Object.values() recibiendo un objeto como parámetro y regresando un arreglo individual por cada llave-valor de dicho objeto.

Sintaxis

Object.entries(objeto)
Enter fullscreen mode Exit fullscreen mode

Por ejemplo:

const perro = {
  nombre:"Coquito",
  raza:"Pastor aleman",
  edad:7,
  color:"cafe",
  sexo: "M"
}

console.info(Object.entries(perro));
//salida:
// 0: Array [ "nombre", "Coquito" ]
// 1: Array [ "raza", "Pastor aleman" ]
// 2: Array [ "edad", 7 ]
// 3: Array [ "color", "cafe" ]
// 4: Array [ "sexo", "M" ]
Enter fullscreen mode Exit fullscreen mode

5.Referencias

6.Conclusiones

Prácticamente en todos los desarrollos que involucren javascript verás objetos tarde o temprano, es importante que conozcas al menos el funcionamiento básico de estos 3 métodos.


Puedes ver mas post de mi autoría a continuación:


img

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .