Javascript代码按顺序运行

Question

我的 JS 代码没有按顺序运行时遇到问题。当出现错误时，它会在执行捕获之前跳到 if(!hadError)，以便 hadError 始终等于 true。我知道这与 javascript 以及它如何同时运行有关，但我不确定如何修复它。这是代码:

var email = $('#email').val();
var password = $('#password').val();
var hadError = false;
// var unlocked = false;

if(email != "" && password != ""){
  auth.signInWithEmailAndPassword(email, password).catch(function(error) {
    // console.log(hadError);
    hadError = true;
    console.log(hadError);
    var errorCode = error.code;
    var errorMessage = error.message;
    $('#login-error').text(errorMessage);
    // unlocked = true;
  });
  if(!hadError){
    success();
  }
}

Answer 1

Firebase 方法是异步的并返回 Promise。您可以在返回 Promise 后执行代码的方法调用之后执行 .then() on，例如

auth.signInWithEmailAndPassword(email, password).then((user) => { 
    //if you want, do something with the `user` which is a firebase.User
    if(!hadError) success();
}).catch(function(error) {
    hadError = true;
    console.log(hadError);
    var errorCode = error.code;
    var errorMessage = error.message;
    $('#login-error').text(errorMessage);
});

根据方法的不同，您甚至可能不需要检查 hadError。

进一步引用:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then

在某些情况下，您可以将第二个方法传递给 then，如果 Promise 被拒绝，则调用该方法，但对于 Firebase，API 引用的方法是 catch 用于错误处理。