Arrays de objetos en Javascript

Contactar con el profesor

Recorrer un array de objetos

const data = [
	{
		"titulo": "La Aventura",
		"autor": "Paco"
	},
	{
		"titulo":"Las cosas",
		"autor": "Pac"
	}
]
data.forEach( obj => {
	console.log(obj.autor);
});

Ejercicio recorrer un array de objetos

Hacer una lista HTML donde se muestren los nombres de los usuarios

const usuarios = [
	{
		"name" : "Paco",
		"isActive" : false
	},
	{
		"name" : "Laura",
		"isActive" : false
	},
	{
		"name" : "Raquel",
		"isActive" : false
	},
	{
		"name" : "Juan",
		"isActive" : true
	},
	{
		"name" : "Alberto",
		"isActive" : false
	},
	{
		"name" : "Rodolfo",
		"isActive" : true
	},
];

find

Permite el elemento de un array que cumple cierta condición

const escenas = [
	{
		"id": 1,
		"titulo": "beso inicial"
	},
	{
		"id": 2,
		"titulo": "beso final"
	}
]

	const escena = escenas.find( obj => obj.id == 2)
	
	console.log(escena);

Ejercicio find

Utilizando el método find, busca el usuario cuyo nombre es Juan y muestra su edad.

const usuarios = [
	{
		"name" : "Paco",
		"isActive" : false,
		"edad": 18
	},
	{
		"name" : "Laura",
		"isActive" : false,
		"edad": 21
	},
	{
		"name" : "Raquel",
		"isActive" : false,
		"edad": 15
	},
	{
		"name" : "Juan",
		"isActive" : true,
		"edad": 17
	},
	{
		"name" : "Alberto",
		"isActive" : false,
		"edad": 50
	},
	{
		"name" : "Rodolfo",
		"isActive" : true,
		"edad":7
	},
];

filter

Permite obtener los elementos de un array cumplen cierta condición.

El método filter recibe como parámetro de entrada una función que devuelve true si queremos añadir al array resultante el objeto que estamos evaluando, y false si no lo queremos añadir.

El siguiente código evalúa cada elemento de un array de números y comprueba si son iguales al valor almacenado en n_introducido. La constante result es un nuevo array compuesto por los elementos que cumplen la condición.

const result = numeros.filter(num => num < n_introducido);

Ejercicios filter

1. Recorre el array anterior para obtener un nuevo array con los usuarios activos.

2. Recorre el array anterior para obtener un array con los usuarios mayores de 18 años.

Reduce

El método reduce permite acumular valores en una variable. Convierte un array en una cadena de texto.

Convertir un array en una cadena

const valores = [{titulo:"t1"},{titulo:"t2"},{titulo:"t3"},{titulo:"t4"}];

let val = valores.reduce(
    // En cada iteración devolvemos el valor que estamos acumulando
    (valorAcumulado, obj) => valorAcumulado + obj.titulo, " valor inicial ");
    
console.log(val);

Convertir un objeto en un array de arrays

const arrayDeArrays = Object.entries(obj);
← Hacer un filtro
Tres en raya con Javascript →

Aviso Legal | Política de privacidad