JavaScript中的Promise仍然会同步执行代码

时间:2018-01-14 17:39:25

标签: javascript firebase firebase-realtime-database es6-promise

function loadTables() {
  refReview.on("value", function(snap) {
    var data = snap.val();
    var file11 = "";


    for (var key in data) {
      console.log("keys retrieved", data[key].revieweeID);

      var idOfReviewee = data[key].revieweeID;


      var promise = getData(idOfReviewee);
      promise.then(function(returnedFnLn) {
        console.log(returnedFnLn);
      });
      console.log("yeah");
    } //end of for loop

  });
}

为什么当promise.then尚未完成时它会执行console.log(“是的”)?

function getData(idRev) {
  return new Promise(function(resolve, reject) {
    getDataToUsers = firebase.database().ref("users").child(idRev);
    getDataToUsers.once("value", function(snap) {
      var fnLn = snap.val();
      var first = fnLn.firstname;
      var second = fnLn.lastname;
      forPromiseFnLn = first.concat(second);

      resolve(forPromiseFnLn);
    });
  });
}

控制台的输出应为

keys retrieved: ,
(firstname and lastname retrieved),
yeah

但反而给出了

keys retrieved ,
yeah,
(firstname and lastname retrieved)

2 个答案:

答案 0 :(得分:1)

这就是异步代表的意思。

在获取数据时,javascript继续执行脚本的其余部分。由于您的console.log("yeah")不属于您的承诺,因此它会在获取数据之前执行。

要么必须同步(如果您尝试获取数据,哪些内容不好),或者您可以将console.log()移到promise.then()功能中。

答案 1 :(得分:0)

那是因为for...in loop是同步的,而Promise是异步的。

如果你想停止循环,直到每个Promise解决你必须

  

切换到ES2017 async/await语法

像这样更改你的代码

function loadTables() {
    refReview.on("value", async function(snap) {
        var data = snap.val();
        var file11 = "";

        for (var key in data) {
            console.log("keys retrieved", data[key].revieweeID);
            var idOfReviewee = data[key].revieweeID;

            var returnedFnLn = await getData(idOfReviewee);
            console.log(returnedFnLn);
            console.log("yeah");
        }
    })
}