javascript

Question

我有一个二维数组名称： final_draft_arr ，我遍历该数组的每个元素，并使用该数组的每个元素调用函数名称： getFileContentAsBase64 。该函数是异步的，并且在为每个元素正确执行该函数之前，for结束。如何解决这种异步行为。我希望函数在循环进入下一个迭代之前执行。代码如下。

    getFileContentAsBase64:async function(path,callback){
        await window.resolveLocalFileSystemURL(path, gotFile);                  
        function gotFile(fileEntry) {
          fileEntry.file(function(file) {
               var reader = new FileReader();
               reader.onloadend = function(e) {
                 var content = this.result;
                 callback(content);
                };
                  reader.readAsDataURL(file);
         });
       }
     },

    base64ToBlob:function(base64, mime) { 
        mime = mime || '';
        var sliceSize = 1024;
        var byteChars = window.atob(base64);
        var byteArrays = [];

        for (var offset = 0, len = byteChars.length; offset < len; offset += sliceSize) {
            var slice = byteChars.slice(offset, offset + sliceSize);
            var byteNumbers = new Array(slice.length);
            for (var i = 0; i < slice.length; i++) {
                byteNumbers[i] = slice.charCodeAt(i);
            }
            var byteArray = new Uint8Array(byteNumbers);
            byteArrays.push(byteArray);
        }
        return new Blob(byteArrays, {type: mime});
    }, 

  //this is the loop
   var final_draft_arr = JSON.parse(retrievedData);
   $.each(final_draft_arr, function(key, value){
      var i_dat = new FormData();                                                                                                               
      var data_id_no = final_draft_arr[key][0];                                                                                                         
      var sub_arr_len = final_draft_arr[key].length;
      for(j=1; j < sub_arr_len; j++){                                                
         getFileContentAsBase64(final_draft_arr[key][j],function(base64Image){
            var base64ImageContent = base64Image.replace(/^data:image\/jpeg;base64,/, ""); 
            var blob_new = base64ToBlob(base64ImageContent, 'image/png');                                                                     
            i_dat.append('Bilder[]', blob_new);

        });                                                 
     }

  });

Answer 1

使用异步函数作为回调并等待异步函数调用。

$.each(final_draft_arr, async function(key, value){
  var i_dat = new FormData();                                                                                                               
  var data_id_no = final_draft_arr[key][0];                                                                                                         
  var sub_arr_len = final_draft_arr[key].length;
  for(j=1; j < sub_arr_len; j++){                                                
     await getFileContentAsBase64(final_draft_arr[key][j],function(base64Image){
        var base64ImageContent = base64Image.replace(/^data:image\/jpeg;base64,/, ""); 
        var blob_new = base64ToBlob(base64ImageContent, 'image/png');                                                                     
        i_dat.append('Bilder[]', blob_new);

    });                                                 
 }
});