一、什么时候需要异步：
1）在可能发生等待的情况
2）等待过程中不能像alert一样阻塞程序的时候
3）因此，所有的“等待的情况”都需要异步
一句话总结就是需要等待但是又不能阻塞程序的时候需要使用异步
二、前端使用异步的场景（下面这些场景都需要等待，但是在等待的过程中又不能阻塞程序，所以需要异步，异步的设计主要是因为javascript是一个单线程的语言，单线程只允许同时做一件事情，如果同时需要做多个，那其他的需要去旁边排队去）：
1）定时任务：setTimeout,setInverval
2）网络请求：ajax请求，img图片的动态加载
3）事件绑定或者叫DOM事件，比如一个点击事件，我不知道它什么时候点，但是在它点击之前，我该干什么还是干什么。用addEventListener注册一个类型的事件的时候，浏览器会有一个单独的模块去接收这个东西，当事件被触发的时候，浏览器的某个模块，会把相应的函数扔到异步队列中，如果现在执行栈中是空的，就会直接执行这个函数。
4）ES6中的Promise
例子：onload
img图片的动态加载异步例子：
console.log("start");
var img=document.createElement_x_x_x_x("img");
img.onload=function(){
console.log("loaded");
}
img.src="/xxx.png";
console.log("end");
结果：先输出start 再输出end最后输出loaded
例子：事件绑定 addEventListener
console.log("start");
var btn1=document.getElementById("btn1");
btn1.addEventListener('click',function(){
console.log("clicked");
})
console.log("end");
结果先输出start再输出end点击按钮之后输出clicked，点击多少次输出多少次clicded
补充：定时器有两种类型：
1）一次性计时器
setTimeout()指定的延迟时间之后来执行代码
clearTimeout()取消setTimeout设置
setTimeout(function(){
console.log(2);
},1000);
var i=setTimeout(function(){
console.log(10);
},1000)
clearTimeout(i);//取消要执行的延时的代码块
2）间隔性触发计时器
setInterval()每隔指定的时间执行代码
clearInterval()取消setInterval()设置
var i=setInterval(function(){
console.log(10);
},1000)
clearInterval(i);//取消要执行的延时的代码块
网友评论