Асинхронная функция: объект for-Loop пуст после оператора await

Question

внизу:

Я не знаю, как объяснить свою проблему, поэтому я начну с примера.У меня есть эта асинхронная функция (в ReactionJS, но я думаю, что это проблема, связанная с JS).

 onUploadDrop = async (e, folderId) => {
        e.preventDefault();
        // check if the user uploaded files or folders
        var uploadedItems = e.dataTransfer.items;
        let files = [];
        for (var i = 0; i < uploadedItems.length; i++) {
            let item = uploadedItems[i].webkitGetAsEntry();
            if (item.isDirectory) {
                alert("is directory")
            } else {
                var file = await this.getFileByWebkitEntry(item);
                files.push(file);
            }
            console.log(i);
        }

     // do something with files[]
    }

Эта функция вызывает другую асинхронную функцию:

getFileByWebkitEntry = async (item) => {
    return new Promise(resolve => {
        item.file(function (file) {
            resolve(file);
        }, function (err) {
            console.log(err);
            resolve("");
        });
    });
}

Я перебираюe.datatransfer.files, которые в основном представляют собой загруженные файлы или папки.К сожалению, этот цикл for выполняется только один раз.

Я выполнил некоторую отладку и обнаружил, что если я помещу console.log до и после этой строки: var file = await ... Это будет получено:

tldr: после того, как оператор await uploadedItems будет пустым, завершится цикл.Почему это происходит?

Answer 1

Я решил это, не используя async - await, а вместо этого Promises.Это выглядит так:

onUploadDrop = (e, folderId) => {
        e.preventDefault();
        // check if the user uploaded files or folders
        var uploadedItems = e.dataTransfer.items;
        let promises = [];
        for (var i = 0; i < uploadedItems.length; i++) {
            let item = uploadedItems[i].webkitGetAsEntry();
            if (item.isDirectory) {
                alert("is directory")
            } else {
                promises.push(this.getFileByWebkitEntry(item));
            }
            console.log(i);
        }

        Promise.all(promises).then(result => {
            // do something with result (result = files)
        });