Ever tried asynchronous iteration with promises?

Question

Ever tried asynchronous iteration with promises?

I have a specific code snippet that I am working on, which involves registering multiple socketio namespaces. Certain aspects of the functionality rely on database calls using sequelize, hence requiring the use of promises. In this scenario, I intend for the complete promise to resolve only after all constructor logic has been executed. However, my current issue is that the complete promise resolves prematurely before the completion of the emitInitialPackage() function.

export class demoClass {
    public complete: Promise<boolean>;
    server: any;

    constructor(io: any) {
        this.server = io;
        this.complete = Promise.resolve(db.Line.findAll()).then(lines => {
                // do some mapping to generate routes and cells
                this.registerEndPoints(routes, [], cells);
            }).catch(err => console.log(err))
    }



registerEndPoints(routes: Array<string>, nsps: Array<any>, cells: Array<string>) {
        for (let i = 0; i < routes.length; i++) {
            nsps.push(this.server.of('/api/testNamespace/' + routes[i]));
            let that = this;
            const nsp = nsps[i];
            nsp.on('connection', function (socket) {
                that.emitInitialPackage(nsps[i], routes[i], cells[i]);
            });
        }
    }

    emitInitialPackage(nsp: any, name: string, cell: any) {
        return db.Line.find({/* Some sequelize params*/}).then(results => {
            nsp.emit('value', results);
        }).catch(err => console.log(err));
    }
}

My question is, how can I ensure that emitInitialPackage is fully completed before allowing complete to resolve?

javascript typescript ecmascript-6 promise es6-promise

Answer 1

Answer №1

For the completion of all operations in the method registerEndPoints, it is essential for this function to return a Promise that can be linked after executing the db.Line.findAll() operation:

export class uniqueClass {
    public done: Promise<boolean>;
    server: any;

    constructor(io: any) {
        this.server = io;
        this.done = Promise.resolve(db.Line.findAll()).then(lines => {
            // returning a promise created by the registerEndPoints method
            return this.registerEndPoints(routes, [], cells);
        }).catch(err => console.log(err))
    }   

    registerEndPoints(routes: Array<string>, nsps: Array<any>, cells: Array<string>) {
        const endPointPromises = routes.map((route, index) => {
          // create a Promise for each endpoint which gets resolved 
          // only when all tasks for the endpoint are completed
          return new Promise((resolve) => {
              nsps.push(this.server.of('/api/uniqueNamespace/' + route));
              const nsp = nsps[index];
              nsp.on('connection', (socket) => {
                // resolve the promise once emitInitialPackage has completed its portion of work
                this.emitInitialPackage(nsps[index], route, cells[index]).then(resolve);
              });          
          });
        });

        return Promise.all(endPointPromises);
    }

    emitInitialPackage(nsp: any, name: string, cell: any) {
        return db.Line.find({/* Specific sequelize parameters*/}).then(results => {
            nsp.emit('value', results);
        }).catch(err => console.log(err));
    }
}

Answer 2

For the completion of all operations in the method registerEndPoints, it is essential for this function to return a Promise that can be linked after executing the db.Line.findAll() operation:

export class uniqueClass {
    public done: Promise<boolean>;
    server: any;

    constructor(io: any) {
        this.server = io;
        this.done = Promise.resolve(db.Line.findAll()).then(lines => {
            // returning a promise created by the registerEndPoints method
            return this.registerEndPoints(routes, [], cells);
        }).catch(err => console.log(err))
    }   

    registerEndPoints(routes: Array<string>, nsps: Array<any>, cells: Array<string>) {
        const endPointPromises = routes.map((route, index) => {
          // create a Promise for each endpoint which gets resolved 
          // only when all tasks for the endpoint are completed
          return new Promise((resolve) => {
              nsps.push(this.server.of('/api/uniqueNamespace/' + route));
              const nsp = nsps[index];
              nsp.on('connection', (socket) => {
                // resolve the promise once emitInitialPackage has completed its portion of work
                this.emitInitialPackage(nsps[index], route, cells[index]).then(resolve);
              });          
          });
        });

        return Promise.all(endPointPromises);
    }

    emitInitialPackage(nsp: any, name: string, cell: any) {
        return db.Line.find({/* Specific sequelize parameters*/}).then(results => {
            nsp.emit('value', results);
        }).catch(err => console.log(err));
    }
}

Answer 3

Answer №2

Let's address some important issues:

Make sure to return the promise from this.registerEndPoints, so that this.complete will only resolve once that promise resolves;
The argument [] passed for the nsps parameter is unnecessary, consider removing it completely;
Wrap the .on('connection', ...) function in a promise;
Create promises within the for loop and pass them to Promise.all for the final result. You can use map for this purpose;
It would be better to have one array of objects instead of three separate arrays (routes, cells, and nsps) with related data at equal indexes;
Since bluebird is promises/A+ compliant, converting a bluebird promise to a native JS promise should not be necessary;

Below is some untested code snippet as an example:

constructor(io: any) {
    this.server = io;
    this.complete = db.Line.findAll().then(lines => {
        // map to generate routes and cells
        return this.registerEndPoints(routes, cells);
    }).catch(err => console.log(err))
}

registerEndPoints(routes: Array<string>, cells: Array<string>) {
    function nspConnect(nsp) {
        return new Promise( resolve => nsp.on('connection', resolve) );
    }
    let that = this;
    const data = routes.map( (route, i) => ({
        nsp: that.server.of('/api/testNamespace/' + route),
        route,
        cell: cells[i]
    }) );
    const proms = data.map( ({nsp, route, cell}) =>
        nspConnect(nsp).then(that.emitInitialPackage.bind(that, nsp, route, cell)) );
    
    return Promise.all(proms); 
}

To add debugging capabilities, you can modify the nspConnect function as follows:

function nspConnect(nsp) {
    return new Promise( resolve => { 
        console.log('creating promise'); 
        return nsp.on('connection', socket => { 
            console.log('resolving'); 
            resolve();
        }); 
    });
}

Answer 4

Let's address some important issues:

Make sure to return the promise from this.registerEndPoints, so that this.complete will only resolve once that promise resolves;
The argument [] passed for the nsps parameter is unnecessary, consider removing it completely;
Wrap the .on('connection', ...) function in a promise;
Create promises within the for loop and pass them to Promise.all for the final result. You can use map for this purpose;
It would be better to have one array of objects instead of three separate arrays (routes, cells, and nsps) with related data at equal indexes;
Since bluebird is promises/A+ compliant, converting a bluebird promise to a native JS promise should not be necessary;

Below is some untested code snippet as an example:

constructor(io: any) {
    this.server = io;
    this.complete = db.Line.findAll().then(lines => {
        // map to generate routes and cells
        return this.registerEndPoints(routes, cells);
    }).catch(err => console.log(err))
}

registerEndPoints(routes: Array<string>, cells: Array<string>) {
    function nspConnect(nsp) {
        return new Promise( resolve => nsp.on('connection', resolve) );
    }
    let that = this;
    const data = routes.map( (route, i) => ({
        nsp: that.server.of('/api/testNamespace/' + route),
        route,
        cell: cells[i]
    }) );
    const proms = data.map( ({nsp, route, cell}) =>
        nspConnect(nsp).then(that.emitInitialPackage.bind(that, nsp, route, cell)) );
    
    return Promise.all(proms); 
}

To add debugging capabilities, you can modify the nspConnect function as follows:

function nspConnect(nsp) {
    return new Promise( resolve => { 
        console.log('creating promise'); 
        return nsp.on('connection', socket => { 
            console.log('resolving'); 
            resolve();
        }); 
    });
}

Ever tried asynchronous iteration with promises?

Answer №1

Answer №2

Similar questions

Creating UI Bootstrap dropdowns using ng-repeat on the fly

Incapable of stacking one canvas on top of another

JQuery is having trouble with playing multiple sound files or causing delays with events

Why isn't this code performing well when trying to alter the styling of DOM elements?

Is there a way to prevent a link from activating when I click on one of its internal elements?

Utilizing TypeScript Generics for Creating Arrays of Objects with Inherited Type Definitions

Is there a way to execute two files concurrently in JavaScript using node.js?

Error: Unable to use map function on users .. cannot perform mapping on functions

What are different ways to modify a bytearray within a file using angular js, whether it is an .xlsx or other

Ways to position divs without causing them to collapse or override existing divs

Every time a new message is sent or received, I am automatically brought back to the top of the screen on the

The ng-model binding does not automatically update another ng-model within the same object

React is throwing an error: Uncaught SyntaxError stating that import declarations are only allowed at the top level of a module. This issue is coming

What is the best way to transform a string into an array?

Unique Version: Some effective tips for utilizing a fork of type definition such as @types

The implementation of conditional parameter types in TypeScript

retain the input data from the form by using the keyup event

When utilizing JavaScript's split method, an empty string returns an array size of one instead of zero

The issue with element.style.backgroundColor not functioning properly within WordPress

Finding the IP address from a hostname in Node.js: A step-by-step guide