61 lines
2.4 KiB
JavaScript
61 lines
2.4 KiB
JavaScript
// // Agregar aquí el código javascript
|
|
|
|
// Construir dinámicamente una tabla HTML con una fila por empleado. Agregar una
|
|
// fila al final que muestre el sueldo promedio del total de empleados.
|
|
|
|
const empleados = [
|
|
{ nombre: "Ana", sector: "Desarrollo", sueldo: 150000 },
|
|
{ nombre: "Luis", sector: "Diseño", sueldo: 120000 },
|
|
{ nombre: "Marta", sector: "Desarrollo", sueldo: 160000 },
|
|
{ nombre: "Carlos", sector: "RRHH", sueldo: 110000 },
|
|
{ nombre: "Julia", sector: "Diseño", sueldo: 130000 }
|
|
];
|
|
|
|
// PROMEDIO DE SUELDOS
|
|
// asignamos las variables y creamos el elemento 'p'
|
|
let body = document.querySelector('body');
|
|
let parrafo = document.createElement ('p')
|
|
|
|
// anexamos al html
|
|
body.appendChild(parrafo);
|
|
|
|
let arraySueldoEmpleados = empleados.map((empleado) => empleado.sueldo); // creamos un array que solamente contenga los sueldos
|
|
let sumatoriaSueldos = arraySueldoEmpleados.reduce((acumulador, numeroActual) => acumulador + numeroActual, 0); // tomamos la lista creada y aplicamos el metodo reduce para sumar todos sus elementos. similar al metodo sum() de python
|
|
let promedioSueldos = sumatoriaSueldos / empleados.length // dividimos las sumatoria de los sueldos por las cantidad de empleados
|
|
|
|
parrafo.textContent = 'promedio de sueldos: ' + promedioSueldos // llenamos el parrafo con el contenido
|
|
|
|
|
|
// TABLA DINAMICA: este ejercicio lo separe en dos partes, la parte dinamica de la tabla y la NO dinamica
|
|
|
|
// Empezamos por la parte NO dinamica de la tabla
|
|
|
|
//creamos los elementos necesarios
|
|
tabla = document.createElement('table');
|
|
tableHead = document.createElement('thead');
|
|
tableRowHeader = document.createElement('tr')
|
|
thc1 = document.createElement('th') // thc: abreviatura de TableHeaderCell
|
|
thc2 = document.createElement('th')
|
|
thc3 = document.createElement('th')
|
|
tableRowNombre = document.createElement('tr')
|
|
tableRowSector = document.createElement('tr')
|
|
tableRowSueldo = document.createElement('tr')
|
|
tableBody = document.createElement('tbody')
|
|
tableData = document.createElement('td')
|
|
|
|
// asignamos a la tabla los elementos NO dinamicos (como el encabezado)
|
|
body.appendChild(tabla);
|
|
tabla.appendChild(tableHead);
|
|
tableHead.appendChild(tableRowHeader);
|
|
tableRowHeader.appendChild(thc1);
|
|
tableRowHeader.appendChild(thc2);
|
|
tableRowHeader.appendChild(thc3);
|
|
tabla.appendChild(tableBody);
|
|
|
|
// aplicamos el textContent a los elementos NO dinamicos
|
|
thc1.textContent = 'Nombre';
|
|
thc2.textContent = 'Sector';
|
|
thc3.textContent = 'Sueldo';
|
|
|
|
|