1. 什么是异步?
阻塞程序进行
2. 何时需要异步?
在可能发生等待的情况,等待过程中不可能像alert一样阻塞程序进行,因此所有的“等待情况”都需要异步。
3. 前端使用异步的场景?
- 定时任务:setTimeout、setInterval
- 网络请求:Ajax请求、动态<img>加载
- 事件绑定
4. 异步和单线程
js是单线程语言,浏览器只分配给js一个主线程,用来执行任务(函数),但一次只能执行一个任务,这些任务形成一个任务队列排队等候执行,但前端的某些任务是非常耗时的,比如网络请求,定时器和事件监听,如果让他们和别的任务一样,都老老实实的排队等待执行的话,执行效率会非常的低,甚至导致页面的假死。所以,浏览器为这些耗时任务开辟了另外的线程,主要包括http请求线程,浏览器定时触发器,浏览器事件触发线程,这些任务是异步的。
浏览器为网络请求这样的异步任务单独开了一个线程,那么问题来了,这些异步任务完成后,主线程怎么知道呢?答案就是回调函数,整个程序是事件驱动的,每个事件都会绑定相应的回调函数。
js是一直是单线程的,浏览器才是实现异步的那个家伙。
如:console.log(100)
setTimeout(function () {
console.log(200);
},1000);
console.log(300)
输出:100 300 200
执行过程:
- 执行第一行,打印100
- 执行setTimeout后,传入setInterval的函数会被暂存起来,不会立即执行(单线程的特点,不能同时做两件事)
- 执行最后一行,打印300
- 待所有程序执行完,处于空闲状态时,会立马查看有没有暂存起来要执行的函数
- 发现暂存起来的setTimeout中的函数,若时间为0,无需等待立即执行;若时间为1000,则1s后再执行。
解答:
1. 同步和异步的区别?
同步会阻塞代码执行,而异步不会
alter是同步,setTimeout是异步
2. 一个关于setTimeout的笔试题
console.log(1);
setTimeout(function () {
console.log(2);
},0);
console.log(3);
setTimeout(function () {
console.log(4)
},1000);
console.log(5);
输出:1 3 5 2 4
3. 前端使用异步的场景?
- 定时任务:setTimeout、setInterval
- 网络请求:Ajax请求、动态<img>加载
- 事件绑定