同步和异步

同步和异步

什么是同步和异步?简单的来说:同步就是顺序执行,产生时间了，会等待执行完了，再执行后面的，异步就是不顺序执行

常见的异步:load事件(别的事件性的都是同步的) setTimeout setInterval requestAnimationFrame() Promise

异步转同步的操作

1.一直异步执行，但是后面的异步写在前面的异步函数内，达到同步等待的效果

var sum=0;
var img=new Image();
img.src="./img/16-.jpg";
img.addEventListener("load",loadHandler);

function loadHandler(e){
sum+=img.width;
var img1=new Image();
img1.src="./img/17.jpg";  //第二张图片的加载在第一张图片加载的函数内
img1.addEventListener("load",loadHandler1);
}

function loadHandler1(e){
sum+=this.width;
console.log(sum);
getSUM(sum);
}

2.顺序同步执行，但是写在一个函数中进行判断加载完毕，加成完成后再执行后面的

var map=new Map();
var img1=new Image();
img1.src="./img/16-.jpg";
img1.addEventListener("load",loadHandler);
var img2=new Image();
img2.src="./img/17.jpg";
img2.addEventListener("load",loadHandler);


function loadHandler(e){
map.set(this,this.width);
if(map.size===2){   //判断加载完成
var sum=0;
for(var value of map.values()){
sum+=value;
}
getSUM(s);
}
}

function getSUM(s){
console.log(s);
}