I am using two function two handle multiple files upload in ReactJS.

const doSomethingAsync = (file, formD)=>{
    return new Promise((resolve) =>{
      
    const type = file.type.split("/")[0];
    const filename = file.name;
    // file reader to preview file
    let reader = new FileReader();
    reader.onload = () => {
      formD.append("fileList", file, filename);
      setSelectedFileForUpload((prevState) => [
        ...prevState,
        {
          file: reader.result,
          type: type,
          name: filename,
        },
      ]);
    };
    reader.readAsDataURL(file);
    });
    
  }

  const handleFileUpload = (e) => {
    const files = e.target.files;
    if (!files) return false;
    let formD = new FormData();
    console.log("START");
    for (const file of files) {
      console.log("MID");
      doSomethingAsync(file,formD);
    }
    console.log("END");
    for (const file of formD) {
      console.log(file); // not getting file. Don't know why.
    }
  };

If I use want to upload two files (or one file). Then
OUTPUT (if we upload two files) :

START
MID
MID
END

As you can see I am looping through formData by using :

for (const file of formD) {
      console.log(file); // not getting file. Don't know why.
    }

But it is NOT executing (may be because of length is 0). So I want to get formData after for of loop completed.