1. //题目
  2. let i;
  3.         for(i=0; i<3; i++){
  4.             const col  = () =>{
  5.                 console.log(i);
  6.             }
  8.         setTimeout(col,100);
  9. }
  11. 得出结果
  12. // 3
  13. // 3
  14. // 3
  16. 大神讲解
  17. 有两点，一个是let 的块级作用域问题， 
  18. 一个是setTimout 直接解析的 col函数 相当于是100毫秒之后新开辟一个方法所以不受 
  19. let 块级作用域的影响
  21. 如果把for(i = 0;...) 改成 for(let = 0)   
  22. 那 setTimeout 还是在 let独立的块级作用域下面还是回按顺序执行

当时我傻傻的觉得循环一遍就等于多次循环结果 我没看结果的答案是 012

当我入坑后我才发现原来是eventloop 宏微任务赶紧学习 我是跪了 我先去学习了

学到了学到了 我没答出来肯定是内卷的还不够继续继续

Event Loop

在JavaScript中，任务被分为两种，一种宏任务（MacroTask）也叫Task，一种叫微任务（MicroTask）。

MacroTask（宏任务）

  • script全部代码、setTimeout、setInterval、setImmediate（浏览器暂时不支持，只有IE10支持，具体可见MDN）、I/O、UI Rendering。

MicroTask（微任务）

  • Process.nextTick（Node独有）、Promise、Object.observe(废弃)、MutationObserver（具体使用方式查看这里）

浏览器中的Event Loop

Javascript 有一个 main thread 主线程和 call-stack 调用栈(执行栈)，所有的任务都会被放到调用栈等待主线程执行。

JS调用栈

JS调用栈采用的是后进先出的规则，当函数执行的时候，会被添加到栈的顶部，当执行栈执行完成后，就会从栈顶移出，直到栈内被清空。

同步任务和异步任务

Javascript单线程任务被分为同步任务和异步任务，同步任务会在调用栈中按照顺序等待主线程依次执行，异步任务会在异步任务有了结果后，将注册的回调函数放入任务队列中等待主线程空闲的时候（调用栈被清空），被读取到栈内等待主线程的执行。
image.png
任务队列Task Queue，即队列，是一种先进先出的一种数据结构。
image.png