Desenrollar Arrays de Objetos en JavaScript

JavaScriptJavaScriptBeginner
Practicar Ahora

This tutorial is from open-source community. Access the source code

💡 Este tutorial está traducido por IA desde la versión en inglés. Para ver la versión original, puedes hacer clic aquí

Introducción

En este laboratorio, exploraremos la función unwind en JavaScript. El propósito de esta función es producir una matriz de objetos a partir de un objeto y una de sus propiedades con valores de matriz. Al usar la extracción de objetos y Array.prototype.map(), podemos crear una matriz de objetos donde cada objeto contiene los valores del objeto original, excepto la clave especificada que se mapea a sus valores individuales. A través de este laboratorio, obtendremos una comprensión más profunda de cómo manipular y extraer datos de objetos en JavaScript.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/BasicConceptsGroup -.-> javascript/array_methods("Array Methods") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/data_types -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/arith_ops -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/comp_ops -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/array_methods -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/higher_funcs -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/destr_assign -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} javascript/spread_rest -.-> lab-28684{{"Desenrollar Arrays de Objetos en JavaScript"}} end

Función para Desenrollar Objeto

Para desenrollar un objeto por su propiedad con valores de matriz, use la función unwind.

  • Para comenzar a codificar, abra la Terminal/SSH y escriba node.
  • La función utiliza la extracción de objetos para excluir el par clave-valor para la key especificada del objeto.
  • Luego, utiliza Array.prototype.map() para los valores de la key dada para crear una matriz de objetos.
  • Cada objeto contiene los valores del objeto original, excepto key que se mapea a sus valores individuales.
const unwind = (key, obj) => {
  const { [key]: _, ...rest } = obj;
  return obj[key].map((val) => ({ ...rest, [key]: val }));
};

Uso de ejemplo:

unwind("b", { a: true, b: [1, 2] }); // [{ a: true, b: 1 }, { a: true, b: 2 }]

Resumen

¡Felicitaciones! Has completado el laboratorio de Desenrollar Objeto. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.