создание класса, позволяющего сократить мой код и повторно использовать его

ProgramBox

создание класса, позволяющего сократить мой код и повторно использовать его

Post author:admin
Запись опубликована:11 января, 2022
Post category:Вопросы по программированию

#javascript #jquery #arrays #function #class

Вопрос:

Я изучаю javascript, так что есть вещи, которые все еще не совсем ясны в моей голове. Я хочу изменить свой код, чтобы сделать его повторно используемым, передав ему определенные параметры.В этот момент я построил этот симулятор кредитов, в гораздо более длинном коде мне пришло в голову создать класс, с помощью которого этот класс сможет передавать требуемые данные и возвращать значения, которые мне нужно отобразить на экране. Первый метод «creacionClientes» создает профиль заявителя на получение кредита и сохраняет его в массиве, мне нужно, чтобы второй метод, который возвращает значение комиссии, которую должен заплатить человек, был добавлен в профиль клиента, запрашивающего кредит. Аналогично, я не могу найти способ для метода «calcularCuotas» использовать информацию, которую получает переменная клиента, я очень застрял и тону в стакане воды!

  const datosTabla = document.querySelector("#tftable,tbody"); const tasas = cambiarValorTasas() let planesVisible = false;

class Clientes {
    constructor (){
        this.clients = []
    }
    creacionClientes(nombre, apellido, email, monto, plazo, tasas){
        this.clients.push({
            id: Date.now(),
            nombre: nombre,
            apellido: apellido,
            email: email,
            monto: monto,
            plazo: plazo,
            tasas: tasas,
        });  
    }
    calcularCuotas(monto, tasas, plazos){
        let hoy = new Date()
        let pagoMensual = 0;
        let pagoAmortizacion = 0;
        let pagosIntereses = 0;
        pagoMensual = monto * (Math.pow(1 tasas/100, plazos)*tasas/100)/(Math.pow(1 tasas/100, plazos)-1);
        while (datosTabla.firstChild){
            datosTabla.removeChild(datosTabla.firstChild);
        }
    
        //creacion de fechas sucesivas
        function formatoFecha(fecha) {
    
            fecha = new Date(fecha);
            var dia = fecha.getDate();
            var mesIndex = fecha.getMonth() 1;
            var año = fecha.getFullYear();
        
            return dia   "/"   mesIndex   "/"   año;
        }
    
        for(let i = 1; i <= plazos; i  ) {
    
            pagosIntereses = parseFloat(monto*(tasas/100));
            pagoAmortizacion = parseFloat(pagoMensual - pagosIntereses);
            monto = parseFloat(monto-pagoAmortizacion);
            
            var fechaX = hoy.setMonth(hoy.getMonth()   1);
            //creacion de las filas
            $("#tablaPrestamos").append(`<tr><td>${formatoFecha(fechaX)}
            <td class="valorCuota">${pagoMensual.toFixed(2)}</td>
            <td>${pagoAmortizacion.toFixed(2)}</td>
            <td>${pagosIntereses.toFixed(2)}</td>
            <td>${monto.toFixed(2)}</td>`);
        }
    }     }

function cambiarValorTasas (){
    let plazosOpc = $("#menuPlazos").prop('selectedIndex');
    let opciones = $("#menuPlazos").prop('options');
    if (opciones[plazosOpc].value == 12){
        $('#tasasSeleccion').html(3.95);
    } else if (opciones[plazosOpc].value == 24){
        $('#tasasSeleccion').html(4.19);
    } else if (opciones[plazosOpc].value == 36){
        $('#tasasSeleccion').html(4.36);;
    }
    return $('#tasasSeleccion').val(); } $(document).on('change', cambiarValorTasas);

function mostrarTabla(nombre, visibilidad ){
    let mostrar = document.getElementById(nombre);
    if (visibilidad == false){
        if(mostrar.classList.contains("noMostrar")){
            mostrar.classList.remove("noMostrar")
        }
        mostrar.className  = " mostrar"
    } else {
        if(mostrar.classList.contains("mostrar")){
            mostrar.classList.remove("mostrar")
        }
        mostrar.className  = " noMostrar"
    } } $('#botonCalc').on('click', (e) =>{
    e.preventDefault();
    mostrarTabla('tasasSeleccion', planesVisible);
    mostrarTabla('tasasLabel', planesVisible);
    mostrarTabla('botonEnviar', planesVisible);
    mostrarTabla('tablaPrestamos', planesVisible);
    planesVisible = !planesVisible;    

})

$('#botonEnviar').on("click", (e) =>{
    e.preventDefault();
    let cliente = new Clientes();
    cliente.creacionClientes($('#nombre').val(), $('#apellido').val(), $('#mail').val(), parseInt($('#aSolicitar').val()), parseInt($('#menuPlazos').val()), parseFloat(tasas))
    console.log(cliente)
    cliente.calcularCuotas(parseInt($('#aSolicitar').val()), tasas, parseInt($('#menuPlazos').val())) })

Ответ №1:

Проблема в том, что вы сохраняете список клиентов внутри клиента

Я бы попробовал это:

Получите список клиентов за пределами каждого клиента
Создайте клиента в конструкторе (вместо creacionClientes)
Добавьте его в список клиентов перед созданием клиента
ТЕПЕРЬ вы можете использовать this внутри calcularCuotas , где хранится информация о клиенте (например this.nombre )

Это может быть что-то в этом роде

 const datosTabla = document.querySelector("#tftable,tbody"); const tasas = cambiarValorTasas() let planesVisible = false;
const clientes = []

class Clientes {
    constructor (nombre, apellido, email, monto, plazo, tasas){
        this = {
            id: Date.now(),
            nombre: nombre,
            apellido: apellido,
            email: email,
            monto: monto,
            plazo: plazo,
            tasas: tasas,
        }   
        clients.push(this);  
    }
    calcularCuotas(monto, tasas, plazos){
        let hoy = new Date()
        let pagoMensual = 0;
        let pagoAmortizacion = 0;
        let pagosIntereses = 0;
        pagoMensual = monto * (Math.pow(1 tasas/100, plazos)*tasas/100)/(Math.pow(1 tasas/100, plazos)-1);
        while (datosTabla.firstChild){
            datosTabla.removeChild(datosTabla.firstChild);
        }
    
        //creacion de fechas sucesivas
        function formatoFecha(fecha) {
    
            fecha = new Date(fecha);
            var dia = fecha.getDate();
            var mesIndex = fecha.getMonth() 1;
            var año = fecha.getFullYear();
        
            return dia   "/"   mesIndex   "/"   año;
        }
    
        for(let i = 1; i <= plazos; i  ) {
    
            pagosIntereses = parseFloat(monto*(tasas/100));
            pagoAmortizacion = parseFloat(pagoMensual - pagosIntereses);
            monto = parseFloat(monto-pagoAmortizacion);
            
            var fechaX = hoy.setMonth(hoy.getMonth()   1);
            //creacion de las filas
            $("#tablaPrestamos").append(`<tr><td>${formatoFecha(fechaX)}
            <td class="valorCuota">${pagoMensual.toFixed(2)}</td>
            <td>${pagoAmortizacion.toFixed(2)}</td>
            <td>${pagosIntereses.toFixed(2)}</td>
            <td>${monto.toFixed(2)}</td>`);
        }
    }     }

function cambiarValorTasas (){
    let plazosOpc = $("#menuPlazos").prop('selectedIndex');
    let opciones = $("#menuPlazos").prop('options');
    if (opciones[plazosOpc].value == 12){
        $('#tasasSeleccion').html(3.95);
    } else if (opciones[plazosOpc].value == 24){
        $('#tasasSeleccion').html(4.19);
    } else if (opciones[plazosOpc].value == 36){
        $('#tasasSeleccion').html(4.36);;
    }
    return $('#tasasSeleccion').val(); } $(document).on('change', cambiarValorTasas);

function mostrarTabla(nombre, visibilidad ){
    let mostrar = document.getElementById(nombre);
    if (visibilidad == false){
        if(mostrar.classList.contains("noMostrar")){
            mostrar.classList.remove("noMostrar")
        }
        mostrar.className  = " mostrar"
    } else {
        if(mostrar.classList.contains("mostrar")){
            mostrar.classList.remove("mostrar")
        }
        mostrar.className  = " noMostrar"
    } } $('#botonCalc').on('click', (e) =>{
    e.preventDefault();
    mostrarTabla('tasasSeleccion', planesVisible);
    mostrarTabla('tasasLabel', planesVisible);
    mostrarTabla('botonEnviar', planesVisible);
    mostrarTabla('tablaPrestamos', planesVisible);
    planesVisible = !planesVisible;    

})

$('#botonEnviar').on("click", (e) =>{
    e.preventDefault();
    let cliente = new Clientes($('#nombre').val(), $('#apellido').val(), $('#mail').val(), parseInt($('#aSolicitar').val()), parseInt($('#menuPlazos').val()), parseFloat(tasas))
    console.log(cliente)
clientes.push(cliente)
    cliente.calcularCuotas(parseInt($('#aSolicitar').val()), tasas, parseInt($('#menuPlazos').val())) })