如何避免 javascript 中的異步功能？

Question

function CanPurchase() {
return new Promise(function(resolve, reject){
  var name = document.getElementById('name').value;
      var civilNumber = document.getElementById('civilNumber').value;

      var canPurchase_query = db.collection("observer").doc("purchase_record").collection("record_set").where("name",
        "==", name).where("civilNumber", "==", civilNumber);
      var result = "";

     canPurchase_query
        .get()
        .then(function (querySnapshot) {
          querySnapshot.forEach(function (doc) {
            // doc.data() is never undefined for query doc snapshots
            result += doc.data().time;
          });
          if (result) {
            console.log("canPurchase", false);
            alert(false);
            resolve(false);
          } else {
            alert(true);
            console.log("canPurchase", true);
            resolve(true);
          }
        })
        .catch(function (error) {
          alert(false);
          console.log("Error getting documents: ", error);
          resolve(false);
        });


});

    }

function StoreBuyerListInDB() {
      var serialNumber = document.getElementById("serialNumber3").value;
      var name = document.getElementById("name").value;
      var count = document.getElementById("count3").value;
      var civilNumber = document.getElementById("civilNumber").value;
      var canPurchase = CanPurchase().then(function(resolvedData){
        return resolvedData;
      });
      sleep(3222);
      //DB에 시리얼넘버, 이름, 개수, 주민번호 넣기
      var docRef = db.collection("users").doc(firebaseEmailAuth.currentUser.uid);
      var docRef2 = db.collection("users").doc(firebaseEmailAuth.currentUser.uid).collection("buyers");
      var docRef3 = db.collection("observer").doc("purchase_record").collection("record_set");
      //로그인된 사용자가 seller인지 확인
      docRef.get().then(function (doc) {
        if (doc.exists) {
          if (doc.data().index != "seller") {
            alert('seller가 아니라면 등록할 수 없습니다! 돌아가세요!');
            return;
          }
          console.log("Document data:", doc.data());
        } else {
          // doc.data() will be undefined in this case
          console.log("No such document!");
          return;
        }
      }).catch(function (error) {
        console.log("Error getting document:", error);
      });

      //어느 칸이라도 비어있으면 안됨
      if (!serialNumber || !name || !count || !civilNumber) {
        alert('제대로 입력해주세요!');
        return;
      }
      //갯수가 0개이상 3개이해
      else if (count < 0 || count >= 3) {
        alert('1인당 3개 이하의 마스크만 구매 가능합니다! 다시 입력해주세요!');
        return;
      }
      //주민번호 유효성
      else if (!ValidateCivilNumber(civilNumber)) {
        alert('주민번호가 유효하지 않습니다.');
        return;
      }
      //전체 구매자 db에 이름, 주민번호가 같은사람이 있을경우 등록 불가
      else if (!canPurchase) {
        alert('이번주에 이미 구매하셨습니다.');
        return;
      }
      else{
        //해당seller의 db에 저장
        docRef2.add({
            name: name,
            serialNumber: serialNumber,
            count: count,
            civilNumber: civilNumber,
            time: firebase.firestore.FieldValue.serverTimestamp()
          })
          .then(function (docRef) {
            console.log("Document written with ID: ", docRef.id);
            alert("seller 저장 완료!");
            setTimeout(GetDataFromDB(), 3000);
          })
          .catch(function (error) {
            console.error("Error adding document: ", error);
            alert("seller 저장 실패!");
          });
        //감사자인 observer db에 저장
        docRef3.add({
            name: name,
            serialNumber: serialNumber,
            count: count,
            civilNumber: civilNumber,
            time: firebase.firestore.FieldValue.serverTimestamp()
          })
          .then(function (docRef) {
            console.log("Document written with ID: ", docRef.id);
            alert("observer 저장 완료!");
            setTimeout(GetDataFromDB(), 3000);
          })
          .catch(function (error) {
            console.error("Error adding document: ", error);
            alert("observer 저장 실패!");
          });
        }
    }

我想知道用戶可以通過使用 CanPurchase() function 和 if 過程來購買物品。 但在實際情況下，它不起作用。

 else if (!canPurchase) {
        alert('이번주에 이미 구매하셨습니다.');
        return;
      }

在這里它只是通過這個邏輯。 所以無論 canPurchase 變量是什么，它只是 go 。 所以我搜索了一些方法來避免這個問題。 我用的是 promise。 但它也不起作用。 我該如何解決？ 太感謝了 ！！

Answer 1

無法使調用異步 API 的代碼同步運行。 如果您想與基於雲的（以及大多數其他現代）API 進行交互，則必須學習使用異步調用。

在您的情況下， CanPurchase的代碼可能會更簡單一些，因為據我所知，您不需要聲明自己的 promise 。 它應該是這樣的：

function CanPurchase() {
  var name = document.getElementById('name').value;
  var civilNumber = document.getElementById('civilNumber').value;

  var canPurchase_query = db.collection("observer").doc("purchase_record")
    .collection("record_set")
    .where("name", "==", name)
    .where("civilNumber", "==", civilNumber);
  var result = "";

  return canPurchase_query
    .get()
    .then(function (querySnapshot) {
      querySnapshot.forEach(function (doc) {
        result += doc.data().time;
      });
      return !result
    })
    .catch(function (error) {
      return false;
    });
});

因此，這不再具有自定義Promise ，而是從 then 內部返回值， then catch和查詢。 這是使用 Promise 時的常見模式，稱為冒泡結果。

您現在可以使用以下命令調用此 function：

canPurchase().then(function(result) {
  if(!result) {
    alert('이번주에 이미 구매하셨습니다.');
  }
}

---

如果您可以使用一些更現代的 JavaScript 功能，您可以使用async / await使這段代碼看起來更熟悉一些：

async function CanPurchase() {
  ...
}

let result = await canPurchase();
if(!result) {
  alert('이번주에 이미 구매하셨습니다.');
}

請記住，這是圍繞帶有承諾的現有流程的語法糖，並且不會改變這些是異步調用的事實。