同步和异步(promise,async,await)

(promise,async,await)，宏任务、微任务

1、同步和异步

同步是指代码在一帧内执行；异步是指需要等待某个内容完成后才执行。

console.log("aaa");
 for(var i=0;i<1000000000;i++){
   
 }
console.log("bbb");//同步

同步 停止等待运行结束，继续后续的运行。

console.log("aa");
setTimeout(function(){
   
console.log("bb");
},5000)
console.log("cc"); //异步

异步操作就是需要等待一个内容完成后继续执行后面的内容，但是不能将后面的内容写在等待函数外，否则就会同时执行两个。

常见异步的事件：

load事件、setTimeout、setInteral、requestAnimationFrame()

如果大量使用onload以及onclick等代码容易造成回调地狱。此时就可以使用promise。

2、promise

处理异步模式，将异步模式摊开来处理。

var p=new Promise(function(resolve,reject){
   
var img=new Image();
img.src="./img/17.jpg";
img.onload=function(){
   
resolve(img);
}
img.onerror=function(){
   
reject(img.src+"地址错误");
}
})
p.then(function(a){
   
 console.log(a);//执行resolve执行这个函数
},function(b){
   
console.log(b);//执行reject执行这个函数
})

promise中的函数有两个参数，两个参数都是函数，如上述代码，一个为resolve当加载成功时调用，一个为reject当加载失败时调用。

Promise中有一个then的方法，它里面也有两个参数，第一个参数是执行resolve执行这个函数，第二个参数是执行reject这个函数。

p.then(function(a){
   
 console.log(a);//执行resolve执行这个函数
}).catch(function(b){
   
console.log(b);//执行reject执行这个函数
})

也可以用then和catch写用法使用一样的，在then调用的函数中也可以使用函数return的返回值再次调用then

 new Promise(function (resolve, reject) {
   
        var img1 = new Image();
        img1.src = "./img/3-.jpg";
        img1.onload = function ()