JavaScript新手求助：如何在PouchDB get() Promise外部使用返回数据

嘿，我完全懂你现在的困惑——刚接触JavaScript异步的时候，这个坑几乎每个人都会踩！你遇到的问题核心是Promise的异步执行特性，咱们一步步拆解来看：

为什么你的代码会输出undefined？ #

你写的代码执行顺序是这样的：

1. 声明var row;，此时row是undefined
2. 调用db.get(id)，这是个异步操作，浏览器会把它放到后台执行，不会阻塞后续代码
3. 直接执行console.log(row)，这时候后台的异步操作还没完成，then里的代码根本没跑，所以row还是undefined
4. 等db.get(id)完成后，才会进入then回调给row赋值，但这时候console.log早就执行完了

解决方案1：用async/await（最直观的写法，推荐新手用） #

async/await是ES2017的语法，能让异步代码看起来像同步代码一样好读，完美解决你的问题：

// 把逻辑放在async函数里
async function fetchAndUseDocument(id) {
  try {
    // await会等待db.get的Promise完成，再继续往下走
    const doc = await db.get(id);
    // 这里你深拷贝了doc，没问题
    const row = JSON.parse(JSON.stringify(doc));
    
    // 在这里就能正常使用row了
    console.log("拿到的数据：", row);
    
    // 如果要在外部用，直接return就行
    return row;
  } catch (err) {
    // 捕获错误
    console.error("获取数据失败：", err);
    return null;
  }
}

// 调用这个函数的方式：
// 方式一：用then接收返回值
fetchAndUseDocument("你的文档ID").then(row => {
  // 在这里就能在外部使用row了
  console.log("外部使用数据：", row);
  // 比如把数据渲染到页面上
  // document.getElementById("content").textContent = row.content;
});

// 方式二：如果在另一个async函数里，可以直接await
async function anotherTask() {
  const row = await fetchAndUseDocument("你的文档ID");
  console.log("在其他async函数里使用：", row);
}

解决方案2：把逻辑放在then回调里（不用新语法的传统写法） #

如果你不想用async/await，也可以把所有需要用到row的代码都放到then回调里面，或者后续的then链中：

var row;
db.get(id)
  .then(function(doc){
    row = JSON.parse(JSON.stringify(doc));
    console.log(row); // 这里肯定能拿到正确数据
    
    // 把所有需要处理row的逻辑都放在这里
    processRow(row);
  })
  .catch(function(err){
    console.error("出错了：", err);
  });

// 专门写一个处理数据的函数
function processRow(data) {
  // 在这里做你想做的操作，比如渲染、计算等等
  console.log("处理数据：", data);
}

关键知识点总结 #

• JavaScript的异步操作（比如PouchDB的get方法、fetch请求等）不会阻塞代码执行，所以不能在异步操作外面直接拿结果
• 所有依赖异步结果的代码，要么放在then/catch回调里，要么用async/await等待异步操作完成后再执行

内容的提问来源于stack exchange，提问作者rSt