javascript - 关于 JavaScript promises 和 "then"语句的新手问题

Question

我是 JavaScript 的新手，我发现 promises 和“then”语句的概念真的很难确定。我在一个使用 Firebase 的网站上工作，我正在尝试从数据库中获取用户数据。这是我目前拥有的:

// Function that fetches a user's data from the database.
getUserData = function(uid) {
  var database = firebase.firestore();
  var docRef = database.collection('users').doc(uid);

  var userData = docRef.get().then(function(doc) {
    if (doc.exists) {
      return doc.data();
    } else {
      console.log("User does not exist.");
      return null;
    }
  }).catch(function(error) {
    console.log("Error getting document:", error);
  });

  return userData;
}

目前，此函数返回一个 Promise 对象。当我将对象记录到控制台时，它说 promise 状态已解决，它的值是 doc.data() 的值。我真正想要的是将 doc.data() 的值沿“链”返回到 getUserData 函数，以便我可以返回并在别处使用它。有没有简单的方法可以做到这一点？我试图找到一种方法来从对象本身获取 Promise 的“值”，但我一无所获，而且到目前为止，我还没有找到任何其他方法来做我想做的事情。

我敢肯定它比看起来要简单得多，我觉得问这种事情就像个白痴，但我已经搜索了几个小时，但我发现的解释都没有帮助.我将不胜感激任何建议。谢谢!

编辑:已解决!谢谢大家的帮助!以防万一这有助于将来偶然发现它的人，我将在此处留下我的最终(工作)代码。不幸的是，无法从同步函数调用它，但它最终足以满足我的目的:

// Function that fetches a user's data from the database.
async function getUserData(uid) {
  var database = firebase.firestore();
  var docRef = database.collection('users').doc(uid);

  var doc = await docRef.get();
  if (doc.exists) {
    return doc.data();
  } else {
    console.log("User does not exist.");
    return null;
  }
}

Answer 1

首先你必须明白Promise主要用于异步操作，它们不会存储值直到异步操作被解决。 promise 不公开任何“get”方法来直接检索它们的值，但只有 then 方法在 promise 得到解决后执行回调。因此，对于 Promise，您始终需要“等待”它解决读取值。

现在，您有两个选择:

第一种是使用老方法then()和catch()。

您让您的函数返回一个 Promise(就像您所做的那样)，并且在调用您的函数的地方，您可以使用 then 使用您的结果执行回调。

getUserData("anId").then((userData) => console.log('the async result is' + userData))

你也可以使用catch来处理错误:

getUserData("anId")
.then((userData) => console.log('the async result is' + userData))
.catch((error) => console.error('wooopsie : ' + error))

至于"new"的做事方式，您可以使用 JS 的 async 和 await 关键字来处理您的 Promise。

基本上，声明为 async 的函数将始终返回一个 Promise，并将定义一个允许使用 await 关键字的上下文。 await 将允许您像同步代码一样编写 Promise 处理。

async function(){
const userData = await getUserData("anId");
console.log('the async result is' + userData);

最后，如果您需要错误处理，您需要用 try-catch 包装 await 指令。

希望这对您有所帮助。