js宏任务和微任务

一、什么是宏任务和微任务

宏任务包括：setTimeout setInterval Ajax DOM事件
微任务：Promise async/await
微任务比宏任务的执行时间要早

  异步和单线程

异步和单线程是相辅相成的，js是一门单线程脚本语言，所以需要异步来辅助

  异步和同步的区别

异步不会阻塞代码的执行

同步会阻塞代码的执行

  前端使用异步的场景

1、定时任务：setTimenout，setlnverval

2、网络请求：ajax请求，动态<img>加载

3、事件绑定

//ajax请求代码示例
console.log('start')
$.get('./data1.json',function(data1){
	console.log(data1)
})
console.log('end')

加载示例：

事件绑定示例：

也就是请求处理过程中，会跳过异步的请求回头再处理，先执行下面的请求

二、执行顺序

1.主线程上宏任务、微任务执行顺序

执行顺序：主线程 >> 主线程上创建的微任务 >> 主线程上创建的宏任务

2.宏任务中包含微任务

执行顺序：主线程 >> 主线程上的宏任务队列1 >> 宏任务队列1中创建的微任务

 

 

总结：

js中的一个机制，就是遇到宏任务，先执行宏任务，将宏任务放入eventqueue，然后在执行微任务。 

要想明白这个机制 就要理解js单线程。因为JS是单线程语言，只能同时做一件事儿。js任务需要排队顺序执行，如果一个任务时间过长，后边的任务也会等着。假如，我们在请求一个网址时，图片加载很慢，网页总不能一直卡不出来，这个时候就可以用异步来解决了

 

异步就是由单线程这个背景而来的，解决了单线程等待的这个问题，异步的特点不会阻塞后面代码的执行。也就是请求处理过程中，你不能闲着，会产生异步的请求，回头再处理，然后继续执行下面的请求