Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

64
Vistas
One Promise from multiple files

The example below shows a snippet of my application. The assumption is: some functions are executed after the document is loaded, others only after the POST response. On this momet, callbacks are placed in the array and executed after the request is completed. It all works as expected. I would like to change these callbacks to one Promise which would be fired just like now "Update.endRequest()"; I wonder if it is possible? Any suggestions are welcome. Or an idea if it can be done better.

update.js

class UpdateClass {
    constructor() {
        this.callbacks = [];
    }

    success(callback) {
        this.callbacks.push(callback);
    }

    endRequest() {
        this.callbacks.forEach(callback => callback());
    }
}

const Update = new UpdateClass();
export default Update;

file1.js

import Update from './update';

export default class File1Class {
    constructor () {
        this.init();
    }

    init() {
        Update.success(this.update);

        exampleFunction();
    }

    update() {
        exampleFunctionAfterUpdate();
    }
}

function exampleFunction() {
    console.log('On document load 1');
}

function exampleFunctionAfterUpdate() {
    console.log('After Update 1');
}

file2.js

import Update from './update';

export default class File2Class {
    constructor () {
        this.init();
    }

    init() {
        Update.success(this.update);

        anotherExampleFunction();
    }

    update() {
        anotherExampleFunctionAfterUpdate();
    }
}

function anotherExampleFunction() {
    console.log('On document load 2');
}

function anotherExampleFunctionAfterUpdate() {
    console.log('After Update 2');
}

app.js

import Update from './update';
import File1Class from './file1';
import File2Class from './file2';

class AppClass {
    constructor () {
        this.init();
    }
    
    init() {
        new File1Class();
        new File2Class();
        
        triggerfunction();
    }
}

function triggerfunction() {
    const button = document.getElementById('trigger');
    
    button.addEventListener('click', () => {
        xhr.open('POST', 'someUrl', true);
        xhr.onload = () => {
            if (xhr.status === 200) {
                Update.endRequest();
            }
        };
        xhr.send(someJsonData);
    });
}

window.app = new AppClass();
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You can use something like this

const promiseObj = new Promise((resolve,reject)=>{
  exampleFunctionAfterUpdate();
  anotherExampleFunctionAfterUpdate();
  resolve(true);
});

function triggerfunction() {
    const button = document.getElementById('trigger');
    
    button.addEventListener('click', () => {
        xhr.open('POST', 'someUrl', true);
        xhr.onload = () => {
            if (xhr.status === 200) {
                // Update.endRequest();
                promiseObj.then(()=> console.log('Functions executed'));
            }
        };
        xhr.send(someJsonData);
    });
}

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda