Stop pending async function in JavaScript

Question

Here I have two JS async functions running simultaneously.

When one has ended (callback has been run), I would like to stop other one to go ahead. However (that's my issue) I cannot use global vars. Then, I would like to know if it is possible to stop a pending function in JS or any way to solve my problem.

I will appreciate any answers :)

EDIT:

Some clarifications:

I am here using pure JS. No HTML provided.
When I am talking about asynchronous, it could be every async function, not only ajax (database, timeout etc.).
We do not know their runtime.

About code, here is a sample of what I would like to produce:

asyncFirst(
    // ... args
    function() { // callback
        console.log('foo');
        stopOther();
    }
);

asyncSecond(
    // ... args
    function() { // callback
        console.log('bar');
        stopOther();
    }
);

asyncFirst(...);
asyncSecond(...);

What algorithm for stopOther() without using 'state' vars?

Are these running in the same local scope? Do you have to go all the way to global to set a flag variable? It would help to see code. — Jared Smith
– Jared Smith, Commented Oct 10, 2014 at 11:41
Use an IIFE as an ancestor of this section of code to create a closure which will allow you to share variables across functions without polluting the global namespace. — Paul S.
– Paul S., Commented Oct 10, 2014 at 11:47
That only works if the callbacks are already in the same scope (and if it isn't the global, no need for an IIFE) or can be re-factored to be so. What if they're in different modules? Need more info from the OP. — Jared Smith
– Jared Smith, Commented Oct 10, 2014 at 11:53

Jared Smith · Accepted Answer · 2014-10-10 12:20:20Z

6

If these functions run in the same scope you can simply set a flag variable and use that as a guard at the end of each callback:

var flag = false;
function async1() {
    //check if other function is done
    if (!flag) {
        //do stuff
    }
    flag = true;
}

function async2() {
    //same structure as the first
}

If these are running in the global scope you will need to use Paul S.'s suggestion of an IIFE

(function() {
    var flag = false;
    function async1() {
        //check if other function is done, if it is don't bother
        if (!flag) {
            //do stuff
        }
        flag = true;
    }
    function async2() {
        //ditto
    }
})();

This will prevent pollution of the global namespace. Note that javascript being single threaded HELPS you here, because the two functions can't hit flag at the exact same time, only one of them will actually make changes. Note also that async1 && 2 do not need to be defined in the same scope, but flag will have to exist in the scope that they are called from.

edited Oct 10, 2014 at 12:20

answered Oct 10, 2014 at 12:15

Jared Smith

22.3k5 gold badges50 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Adrien Cadet Over a year ago

With a flag, I would have done the same method than yours :) But my issue is to do same stuff without this kind of var.

Jared Smith Over a year ago

You mentioned that you couldn't use a global var. In the second example above flag is not global, it is local to the anonymous function that is invoked immediately after being declared. Not sure why this won't work for you, is there a reason other than global namespace pollution you can't use a flag?

Adrien Cadet Over a year ago

Sorry, I was unclear. I meant using a flag var, as you explained. Actually, I don't know when async callback will be run. In my algorithm, I could use a flag as you did, but meanwhile async function has ended, flag could have been reset or edited. Then, I can assume nothing for it. That's why I am seeking an alternative.

Jared Smith Over a year ago

In that case you have only one option that I know of. Javascript has 'run until done' execution with ONE exception, the upcoming (read: not yet implemented in most browsers) ES 6 spec introduces the yield operator which suspends function execution. You can make all your asyncs yield before modifying state and have an 'async manager' that restarts excution on which one you want. Check out kangax's compatibility tables to see which browsers it works in now.

Adrien Cadet Over a year ago

I don't understand what you want to do. Could you post a short example please?

|

Adrien Cadet · Accepted Answer · 2015-01-09 05:08:02Z

6

Unfortunately, there is no way to stop an asynchronous running method without using 'state' var. Once called, method cannot be stopped, even using very 'low-level' JS methods.

For 'state' var, please check Jared Smith's answer.

answered Jan 9, 2015 at 5:08

Adrien Cadet

1,3413 gold badges15 silver badges21 bronze badges

Comments

Mathieu Labrie Parent · Accepted Answer · 2014-10-10 11:42:05Z

-3

Well, if you can't use global var, something as to tell you to not process ...

1) put something in a hidden field and check for that value.

2) make an ajax call to check a flag server side.

that the only thing i see.

answered Oct 10, 2014 at 11:42

Mathieu Labrie Parent

2,6061 gold badge12 silver badges10 bronze badges

3 Comments

Aadit M Shah Over a year ago

There's no need for such hacks. JavaScript has local (private) variables.

Jared Smith Over a year ago

That's ridiculous. There are plenty of other ways depending on what scope the callbacks are in, what 3rd party libs (if any) are in use, etc. No need to drop a nuclear bomb on the anthill.

Mathieu Labrie Parent Over a year ago

i agree but he specified he cannot use global var so i tought the solution of using javascript variable client side is exclude

Collectives™ on Stack Overflow

Stop pending async function in JavaScript

3 Answers 3

6 Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related