浏览器处理JS的线程

来源:互联网 发布:screw it,let's do it 编辑:程序博客网 时间:2024/05/29 03:02

说到JS的单线程,那是我一个多月前的深夜在学习node的时候无意看到了这段代码

setTimeout(()=>{    console.log(1)},0)console.log(2)

这段代码输出结果是 : 2 ,1
看到了这我就有点小惊讶,我一直以为JS是从上到下执行下来的,应该是1,2,然后我去查了一下资料,发现其实是浏览器来帮JS实现异步,而这个所谓的异步处理,其实就是定时器,AJAX请求等放到其它线程上,先处理主线程上面的事件,等定时器的时间到了或者收到了AJAX请求的数据,就通过它们的回调函数,回到主线程上,等待主线程处理完事件后再去执行他们的回调。
再举个例子

setTimeout(()=>{    console.log(2)},0)for(let i =0;i<9999;i++){    console.log(1)}

这里先输出的是9999个1,最后才会输出2,因为setTimeout的函数一开始就被移到了副线程上,然后等时间到了再到了主线程,而这时候主线程已经有函数在执行了,所以要等前面的函数执行完才会输出2
再举个例子

setTimeout(()=>{    console.log(2)},0)while(true){    console.log(1)}

你会发现这个函数会卡死,永远不会输出2,因为下面那个是个死循环。
说了这么多,其实就是想说JS在浏览器中是如何异步处理的。
PS:数据的处理只会在主线程进行,其它副线程只是等待执行的而已。而如果是几个AJAX请求的话,也不会按照你写的顺序放在主程序去执行,主要是哪个AJAX请求比较快收到数据,那个请求的回调函数就会比较快放到主线程执行。

写的就这么多了,要是有哪里写的不对的请大家指出,我好修改下。
下次写的估计会在vue,vuex,element , echarts中挑一个或几个来说下一些小心得,大家如果有什么问题也可以踊跃提出下,虽然我也不一定能解决,哈哈哈哈哈哈~

原创粉丝点击