问题
I have a function that upon completion re-queues itself with setTimeout(). Could someone explain why Chrome DevTools makes it look like it's calling itself recursively? My understanding is the call stack ought to be clear on each invocation.
Take this very simple example:
<html>
<head>
<script>
function main() {
setTimeout(main, 100); // set breakpoint here
}
main();
</script>
</head>
<body></body>
</html>
The first time the breakpoint is hit I see this:
After 3 more iterations I see this:
Firefox developer tools does what I expect and just shows one instance of the function on the stack each time the breakpoint is hit.
Is there some kind of subtle reference capture going on under Chrome that I'm not aware of, or is this just a DevTools UI thing?
回答1:
To hide it - go to
Devtools Settings -> Preferences -> Debugger
Check "Disable async stack traces"
But I strongly recommend to leave it as is. It is very useful for debugging.
来源：https://stackoverflow.com/questions/47585441/why-does-settimeout-clutter-my-call-stack-under-chrome-devtools