ES8: object entries y object values

Si llegaste hasta acá vas por la mitad del curso, no te rindas 😄

Hola Chic@s
ES8:

• Object entries

const countries = { MX: "Mexico", CO: "Colombia", CL: "Chile", PE: "Peru"}
console.log(Object.entries(countries));

• Object values

const countries = { MX: "Mexico", CO: "Colombia", CL: "Chile", PE: "Peru"}
console.log(Object.values(countries));

Algo que me di cuenta, conn “Object.entries” es que, solo te transforma los objetos en array que estén en el primer nivel,

Pero si tienes un objeto que tiene otro objeto dentro, el objeto que esta mas adentro, permanecerá igual.

Pensé qué pasaría si utilizo esta función y sus métodos con un array y adivinen qué jaja, funciona perfectamente, ahora entiendo que los arrays y los objetos son exactamente lo mismo, pero, la clave de cada valor en un array es su índice o posición, pues si usan object.keys(nombreDelArray), les aparecen los indices, y con object.entries aparecen los indices y el contenido.

hay muchos metodos que nos permiten transformar un object to array entre ellos Object.assign(Arraydata)

El método Object.assign() copia todas las propiedades enumerables de uno o más objetos fuente a un objeto destino. Devuelve el objeto destino.

Estos métodos son muy útiles cuando es necesario convertir un objeto en un array. Y tener un array es mucho mejor porque tiene métodos de manipulación muy útiles como .map() .reduce() o .filter().
.
Pero sabían que también es posible transformar un array en un objeto? es decir el proceso inverso?
.
Esto se hace con Object.fromEntries

Apunte en Notion

LINK: https://pogolo.notion.site/16-ES8-object-entries-y-object-values-3c6b9365f9c44593bc93bc3be98b6654

ES8: object entries y object values

Estas características se introdujeron en ECMAScript 2017 (ES8). Estas implementaciones están relacionadas con la manipulación de objetos: Object.entries() y Object.values().

Veamos en qué consisten estas características:

1. Object.entries():

Object.entries() es un método introducido en ES8 que devuelve un arreglo de pares [clave, valor] propios y enumerables de un objeto dado. Este método te permite recorrer de manera más concisa las propiedades y valores de un objeto que utilizando bucles tradicionales.

Aquí tienes un ejemplo de uso:

const persona = {
  nombre: 'Juan',
  apellido: 'Pérez',
  edad: 30
};

const entradas = Object.entries(persona);

console.log(entradas);
// Salida: [ ['nombre', 'Juan'], ['apellido', 'Pérez'], ['edad', 30] ]

1. Object.values():

Object.values() es otro método introducido en ES8 que devuelve un arreglo con los valores propios y enumerables de un objeto dado.

Aquí tienes un ejemplo de uso:

const persona = {
  nombre: 'Juan',
  apellido: 'Pérez',
  edad: 30
};

const valores = Object.values(persona);

console.log(valores);
// Salida: ['Juan', 'Pérez', 30]

Ambos métodos son muy útiles para trabajar con objetos, especialmente cuando necesitas recorrer las propiedades o valores de un objeto. Pueden simplificar tu código y hacerlo más legible.

Recuerda que el soporte de estos métodos en navegadores y Node.js puede variar según el entorno y la versión que estés utilizando, por lo que es recomendable verificar la compatibilidad si estás apuntando a entornos específicos.

Espero sea de ayuda. 👨‍💻

02-object-keys.js

const countries = { MX: 'Mexico', CO: 'Colombia', CL: 'Chile', PE: 'Peru'};

console.log( Object.keys(countries) ); 
// >> [ 'MX', 'CO', 'CL', 'PE' ]

Tan potentes keys, values y entries 😄

Transformando objetos

Los objetos carecen de muchos métodos que existen para los arrays, tales como map,filter y otros.

Si queremos aplicarlos, entonces podemos usar Object.entries seguido de Object.fromEntries:

1. Use Object.entries(obj) para obtener un array de pares clave/valor de obj.
2. Use métodos de array en ese array, por ejemplo map para transformar estos pares clave/valor.
3. Use Object.fromEntries(array) en el array resultante para convertirlo nuevamente en un objeto.

Por ejemplo, tenemos un objeto con precios y queremos duplicarlos:

let prices = {
	banana: 1,
	orange: 2,
	meat: 4,
};

*let doublePrices = Object.fromEntries(
	// convertir precios a array, map - cada par clave/valor en otro par
	// y luego fromEntries nos devuelve el objeto
	Object.entries(prices).map(([key, value]) => [key, value * 2])
);*

alert(doublePrices.meat); // 8

Puede parecer difícil a primera vista, pero se vuelve fácil de entender después de usarlo una o dos veces. Podemos hacer poderosas cadenas de transformaciones de esta manera.

Mi ejemplo:

const emojis = { 'happy': '😃', 'sad': '😔', 'cool': '😎' }
console.log(Object.entries(emojis))
// OUT
[
  [ 'happy', '😃' ],
  [ 'sad', '😔' ],
  [ 'cool', '😎' ]
]

con values

const emojis = { 'happy': '😃', 'sad': '😔', 'cool': '😎' }
console.log(Object.values(emojis))
// OUT
[ '😃', '😔', '😎' ]

crei que solo estaba la version ecmaScript 6

Crea una función que reciba el objeto inventario y una función de comparación, y devuelva un nuevo objeto que contenga solo las propiedades que cumplen la condición especificada por la función de comparación. Por ejemplo, si la función de comparación verifica si la cantidad es mayor o igual a 5:

solucion:

const inventario = {
    item1: {
      nombre: 'Lápiz',
      cantidad: 5
    },
    item2: {
      nombre: 'Borrador',
      cantidad: 2
    },
    item3: {
      nombre: 'Cuaderno',
      cantidad: 10
    }
  };


  function filter2 (operator, parameter, array=inventario){
    const filtred2=[]
    const entry = Object.entries(array)
    
    for(const[x,y] of entry){
        const {nombre, cantidad} = y;
        switch(operator){
            case '<' :if(cantidad<parameter){filtred2.push([x,y])}; break;
            case '>' :if(cantidad>parameter ){filtred2.push([x,y])} break;
    }
    
  }
  console.log(filtred2)
}

solo un poco de ejercicio

No sé porque no mencionaron a Object.keys pero aqui dejo mi resumen:

Con object keys puedes obtener las llaves de tu objecto.

const countries = {
    MX: 'Mexico',
    CO: 'Colombia',
    CL: 'Chile',
    PE: 'Peru'
};

console.log(Object.keys(countries));

📜 Archivos del Proyecto 📜

Pasos 📌

• • Dentro de la carpeta src, crear la carpeta: es8.
• • • Dentro de la carpeta es8, crear el archivo llamado: 00-object-entries.js
    ◦ El código queda:

//Compilar: seleccionar el código + click derecho + Run Code

//Ejercicio #1

const countries = {MX: 'Mexico', CO: 'Colombia', CL: 'Chile', PE: 'Peru'};
console.log(Object.entries(countries)); //Transforma el objeto a una representación de array

/*output:
[
[ 'MX', 'Mexico' ],
[ 'CO', 'Colombia' ],
[ 'CL', 'Chile' ],
[ 'PE', 'Peru' ]
]
*/

• • Dentro de la carpeta es8, crear el archivo llamado: 01-object-values.js
  • • ◦ El código queda:

//Compilar: seleccionar el código + click derecho + Run Code

//Ejercicio #1
const countries = {MX: 'Mexico', CO: 'Colombia', CL: 'Chile', PE: 'Peru'};
console.log(Object.values(countries)); //Solo trae los valores

/*output:
[ 'Mexico', 'Colombia', 'Chile', 'Peru' ]
*/

19/35 ES8: object entries y object values
Los métodos de transformación de objetos a arrays son útiles para extraer información de un objeto y convertirla en un array. Hay tres métodos que podemos utilizar:

• Object.entries()
• Objetc.keys()
• Object.values()

El método Object.entries() nos permite obtener los pares de valores de un objeto en un array. Cada entrada en el array contiene dos elementos: la propiedad del objeto y su valor correspondiente. Por ejemplo, si queremos obtener los pares de valor del objeto “usuario” que contiene el nombre, correo electrónico y edad de un usuario, podemos utilizar Object.entries(usuario) y el resultado sería un array con las entries en forma [propiedad, valor] del objeto.

El método Object.keys() nos permite obtener las propiedades de un objeto en un array. Si queremos obtener las propiedades del objeto “usuario” mencionado anteriormente, podemos utilizar Object.keys(usuario) y el resultado sería un array con las propiedades del objeto.

El Objeto.values() nos permite obtener los valores de cada propiedad de un objeto en un array. Si queremos los valores del objeto “usuario”, podemos utilozar Object.values(usuario) y el resultado sería un array con los valores de cada propiedad del objeto.

Por ejemplo, si tenemos un objeto “coche” con propiedades como “marca”, “modelo” “año” podemos utilizar estos métodos para extraer información específica del objeto y convertirla en un array. Por ejemplo:

const coche = {
	marca:"Toyota",
	modelo:"Corolla",
	año: 2020
	}

Objet.entries(coche) //devuelve un array con entries [propiedad, valor]
//[['marca', 'Toyota'],{'modelo','Corolla'],['año',2020]]

Object.keys(coche) // devuelve un array con las propiedades del objeto
// [ 'marca', 'modelo', 'año' ]

Object.values(coche) // devuelve un array con los valores de cada propiedad del objeto
// [ 'Toyota', 'Corolla', 2020 ]

Dejo un extra a estos metodos para objetos. Así como está object.values. También está object.keys con la misma sintaxis para obtener las llaves de nuestros objetos solamente en un único array. Ej:

const countries = {
    MX: 'Mexico',
    CO: 'Colombia',
    CL: 'Chile',
    PE: 'Peru'
};

console.log(Object.keys(countries));

/*
Output: 
[ 'MX', 'CO', 'CL', 'PE' ]
*/

const obj = {
    MX: 'Mexico',
    CO: 'Colombia',
    CL: 'Chile',
    AR: 'Argentina'
}

// Convierte a los valores de un objeto literal en un array
console.log (Object.values (obj))
// [ 'Mexico', 'Colombia', 'Chile', 'Argentina' ]

// Convierte a los keys de un objeto literal en un array
console.log (Object.keys (obj))
// [ 'MX', 'CO', 'CL', 'AR' ]