I just started using JavaScript in a web context and I can't quite wrap my head around callback functions yet, but I think in my current scenario I will need one (or more?).
I have two functions that need to run in an alternating order over and over until a certain condition is met (the condition itself depends on function2 changing a global variable in a certain way, not sure if that's relevant).
So initially I tried this:
while(condition !== true) {
function1();
function2();
}
However, this does not work since both (!) functions make use of a setInterval
function to handle an animation each and so the while loop executes everything way too fast and does not wait for the functions to finish. Now I learned that supposedly I need to use a callback function in my function. However, since function2()
needs to wait for function1()
and function1()
needs to wait for function2()
after that, I don't quite get how to use callbacks here, since I think this would need some sort of infinite callback chain.
If this helps, with pseudo-code, at the moment the entire setup looks like this (let's assume it waits for a global variable to reach a certain index):
var myGlobalCounter = 0;
while(myGlobalCounter < 8) {
doSomeStuff(400);
doSomeMoreStuff(400);
}
function doSomeStuff(targetCount) {
// first function that needs setInterval
var localCount = 0;
myInterval = setInterval(function(){
if (localCount !== targetCount) {
count += 1;
// animation happening here
} else {
clearInterval(myInterval);
}
},20);
}
function doSomeOtherStuff(targetCount) {
// second function that needs setInterval and alters the global counter
var localCount = 0;
myInterval = setInterval(function(){
if (localCount !== targetCount) {
localCount += 1;
// another animation happening here
myGlobalCounter += 1;
} else {
clearInterval(myInterval);
}
},20);
}
How can I fix this setup? Keep in mind that I am very much a beginner and I would like a solution in plain JavaScript as I have managed to avoid jQuery for the rest of the project so far and am interested in the underlying logic of using callbacks in a while loop.
To alternate two functions based on a condition.You can pass the condition and functions to each other.
function function1(condition, otherFunction) {
// code
if(!condition) otherFunction(condition, function1);
}
function function2(condition, otherFunction) {
// code
if(!condition) otherFunction(condition, function2);
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.