Gestión de Coches con Clases y Validación en JavaScript
Classified in Technology
Written on in
English with a size of 4.18 KB
Definición de la Clase Coche
A continuación se implementa la clase Coche en JavaScript, la cual define atributos privados por convención, métodos de cálculo y un método estático para listar los elementos en una ventana emergente:
class Coche {
constructor(marca, modelo, anioFabricacion, precioCompra, precioVenta) {
this._marca = marca;
this._modelo = modelo;
this._anioFabricacion = anioFabricacion;
this._precioCompra = precioCompra;
this._precioVenta = precioVenta;
}
calculaGanancia() {
return (this._precioVenta - this._precioCompra);
}
calculaEdad() {
var anioActual = new Date();
return (anioActual.getFullYear() - this._anioFabricacion);
}
static listarCoches() {
var tabla = "<table border>" +
"<tr>" +
"<th>Marca</th>" +
"<th>Modelo</th>" +
"<th>Año Fabricación</th>" +
"<th>Edad del coche</th>" +
"<th>Precio Compra</th>" +
"<th>Precio de venta</th>" +
"<th>Ganancia/Pérdida</th>" +
"</tr>";
arrayCoches.forEach(coche => {
tabla += ("<tr><td>" + coche._marca + "</td><td>" + coche._modelo + "</td><td>" + coche._anioFabricacion + "</td><td>" + coche.calculaEdad() + "</td><td>" + coche._precioCompra + "</td><td>" + coche._precioVenta + "</td><td>" + coche.calculaGanancia() + "</td></tr>");
});
tabla += "</table>";
var miVentana = window.open("", "Coches", "height=500px,width=1000px");
miVentana.document.write(tabla);
}
}Inicialización del Listado de Vehículos
Se inicializa el array con instancias predeterminadas de Coche:
var arrayCoches = [
new Coche("Opel", "Corsa", 2014, 5000, 6500),
new Coche("Ferrari", "Enzo", 2010, 15000, 20000),
new Coche("Lamborghini", "Murcielago", 2000, 8000, 17000)
];Proceso de Alta y Registro en el DOM
Función encargada de recolectar la información ingresada en el formulario HTML, verificarla y agregar el nuevo registro:
function alta() {
var marca = document.getElementById("marca").value;
var modelo = document.getElementById("modelo").value;
var anio = document.getElementById("anio").value;
var precioVenta = document.getElementById("precioVenta").value;
var precioCompra = document.getElementById("precioCompra").value;
if (confirm("¿Seguro que quieres dar de alta?")) {
if (marcaValida(marca) && modeloValido(modelo) && anioValido(anio) && precioValido(precioVenta) && precioValido(precioCompra)) {
arrayCoches.push(new Coche(marca, modelo, anio, precioCompra, precioVenta));
alert("La operación se ha completado");
} else {
alert("Los datos introducidos no son válidos");
}
} else {
alert("La operación ha sido cancelada");
}
}Funciones de Validación de Datos
Se emplean las siguientes comprobaciones para garantizar la integridad de los datos ingresados:
- marcaValida y modeloValido: Verifican una longitud comprendida entre 2 y 20 caracteres.
- anioValido: Comprueba una estructura de 4 dígitos y que no exceda el año actual.
- precioValido: Valida que sea un valor numérico y mayor o igual a cero.
function marcaValida(marca) {
return (marca.length >= 2 && marca.length <= 20);
}
function modeloValido(modelo) {
return (modelo.length >= 2 && modelo.length <= 20);
}
function anioValido(anio) {
var expresion = /\d{4}/;
var anioActual = new Date();
return (anio <= anioActual.getFullYear() && expresion.test(anio));
}
function precioValido(precio) {
var expresion = /\d/;
return (expresion.test(precio) && precio >= 0);
}