async和await實現異步的同步等待

async和await的使用

解決問題:可以把異步變成同步等待的操作

使用要求:

1.async和await是配套使用的，await必須寫在async函數的內部
2.async是定義在函數function前面，返回一個Promise對象
3.await只能處理Promise對象的異步等待(別的setTimeout,load等造成的異步不能被處理,如果這些異步也想要被處理成同步等待，只能放在Promise里面)
4. 函數中使用return返回的內容可以通過then來獲取

使用示例:

 function getImage(src) {       //返回Promise對象
        return new Promise(function (resolve, reject) {
          var img1 = new Image();
          img1.src = src;
          img1.onload = function () {  
            resolve(img1);
          };
        });
      }
        async function loadImages(){  //async也返回Promise對象
            var arr=[];
            for(var i=3;i<30;i++){
               await getImage("./img/"+i+"-.jpg").then(function(img){
                    arr.push(img);
        })
      return arr;
}
  var p=loadImages();   //函數中使用return返回的內容可以通過then來獲取
        p.then(function(arr){
            console.log(arr);
  })

setTimeout等異步的同步等待

var arr=[];
for(var i=0;i<30;i++){
    await new Promise(function(resolve,reject){
     setTimeout(function(){  //必須放在Promise中
         resolve(i);
     },1000);
 }).then(function(n){
   arr.push(n);
   })
 } 
  console.log(arr);
}