Say we call 10000 setTimeouts, each with a random time, each with a few nested timeouts too. What happens in terms of the 1 call stack, or are there multiple call stacks? How does that work?
So for example:
let i = 0
while (i++ < 10000) {
process(`process ${i}`, randomBetween(5, 30))
}
function process(name, timeout) {
console.log(`${name} called`)
setTimeout(() => {
console.log(`${name} timeout called`)
setTimeout(() => {
console.log(`${name} nested timeout 1 called`)
}, 25)
setTimeout(() => {
console.log(`${name} nested timeout 2 called`)
}, 30)
setTimeout(() => {
console.log(`${name} nested timeout 3 called`)
}, 15)
setTimeout(() => {
console.log(`${name} nested timeout 4 called`)
}, 5)
}, timeout)
}
function randomBetween(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min)
}
I get how callbacks, event loops, and async work. But I don’t understand the data structure used to implement the callstack(s) in this case. What would it look like, how would it work?
I am asking because I want to implement this feature in a custom programming language, and am having difficulty imagining what the structure is of the callstack(s) under the hood.