在 javascript 中将数组推入异步函数会产生空数组或嵌套数组

Question

我有一个异步功能，可以将表单中的多个文件存储到 Firebase 存储中，我想收集文件名，以便在下一步中将它们存储在数据库中。

问题是生成的文件名数组有点“嵌套”，当存储到数据库中时，该字段为空。当我在控制台中return数组时（请看下图），数组为：

如果使用 JSON stringify 粘贴（图中的绿线）
是一种无法保存到数据库的“多级”数组（在列表中作为数组）（图中粉红色的线）
Array转String时为空（图中蓝线）

请建议如何更正此问题。谢谢！

这是我的代码：

var $dbTimestamp = firebase.firestore.Timestamp.now();
var $fileNames = [];

// I use Promise to wait for all names to be pushed to Array
let myPromise = new Promise(function(success){
    success(
        // Function triggers Async function for each file to be uploaded
        $filesForUpload.map(async function(file, index){
            var $fileName = "rfp/rfp" + $dbTimestamp.valueOf().slice(0,12) + (index + 1);
            // Waiting for the upload to complete
            await $storageRef.child($fileName).put(file).then(function(snapshot){
                console.log("200 File upload completed. File(s) " + (index + 1) + "/" + $filesForUpload.length);
                // Here is where I update my array
                $fileNames.push($fileName);
            }).catch(function(error){
                console.error("500 File upload failed. File(s) " + (index + 1) + "/" + $filesForUpload.length, error);
                NotifyServerError();
            });
        })
    );
});
// Once promise is completed, i try to pass list of file names to next function.
myPromise.then(
    function(success){
        UpdateDB($fileNames, $dbTimestamp);
        console.log(JSON.stringify($fileNames));
        console.log($fileNames);
        console.log($fileNames.toString());
    }
);

Answer 1

你不能await在.map()、.forEach()、.filter()等方法中，但你可以在for(... of ...)循环。
在这里使用 .map() 是没有用的，因为它不返回任何东西。
您正在混合使用 await 风格和 .then()-Promise 风格，这里只有 await 风格。

const $dbTimestamp = firebase.firestore.Timestamp.now();
const $fileNames = [];

const myPromise = async() => {
  for (let file of $filesForUpload) {
    const $fileName = "rfp/rfp" + $dbTimestamp.valueOf().slice(0, 12) + (index + 1);
    try {
      const snapshot = await $storageRef.child($fileName).put(file);
      console.log("200 File upload completed. File(s) " + (index + 1) + "/" + $filesForUpload.length);
      // Here is where I update my array
      $fileNames.push($fileName);
    } catch (error) {
      console.error("500 File upload failed. File(s) " + (index + 1) + "/" + $filesForUpload.length, error);
      NotifyServerError();
    }
  }
}

( async () => {
  await myPromise();
  UpdateDB($fileNames, $dbTimestamp); // <- You probably want to await this as well...
  console.log(JSON.stringify($fileNames));
  console.log($fileNames);
  console.log($fileNames.toString());
})()

在 javascript 中将数组推入异步函数会产生空数组或嵌套数组

Push array inside async function in javascript produces empty or nested array

javascript

arrays

asynchronous

push

promise