时间戳

首页 > 解决方案 > 如何从 async 函数中访问 async/await 范围变量？

javascript - 如何从 async 函数中访问 async/await 范围变量？

问题描述

我想使用async/await 函数中cafesList的placeList变量，以便我可以将这两个包含对象数组的变量传递给另一个函数，在该函数中，我将把这两个变量数据组合到一个对象数组中。

我试图将这两个变量声明为全局变量并尝试在外部使用但得到如下输出 -

Promise {<pending>} __proto__: Promise [[PromiseStatus]]: "resolved" [[PromiseValue]]: undefined

但是当fetchCafes()直接fetchPlaces()调用时，这些函数会产生对象数组作为结果。

这是 fetch api 方法 -

function sendHttpRequest(method, url) {
  return fetch(url, {
    method: method,
  })
    .then((response) => {
      if (response.status >= 200 && response.status < 300) {
        return response.json();
      } else {
        return response.json().then((errData) => {
          console.log(errData);
          throw new Error("Something went wrong! - Server Side");
        });
      }
    })
    .catch((error) => {
      console.log(error);
      throw new Error("Something went wrong!");
    });
}

这些是包含cafesList和placeList变量的两个 async/await 方法 -

async function fetchCafes() {
  try {
    const cafesList = await sendHttpRequest(
      "GET",
      "https://raw.githubusercontent.com/debojyoti/places-fake-rest-api/master/cafes.json"
    );
    console.log(cafesList);
  } catch (error) {
    console.log(error.message);
  }
}

async function fetchPlaces() {
  try {
    const placeList = await sendHttpRequest(
      "GET",
      "https://raw.githubusercontent.com/debojyoti/places-fake-rest-api/master/places.json"
    );
    console.log(placeList);
  } catch (error) {
    console.log(error.message);
  }
}

标签： javascriptecmascript-6

解决方案

这是给你剪的吗？

从函数返回数据：

async function fetchCafes() {
    try {
        const cafesList = await sendHttpRequest(
            "GET",
            "https://raw.githubusercontent.com/debojyoti/places-fake-rest-api/master/cafes.json"
        );
        console.log(cafesList);
        return cafesList;
    } catch (error) {
        console.log(error.message);
    }
}

async function fetchPlaces() {
    try {
        const placeList = await sendHttpRequest(
            "GET",
            "https://raw.githubusercontent.com/debojyoti/places-fake-rest-api/master/places.json"
        );
        console.log(placeList);
        return placeList;
    } catch (error) {
        console.log(error.message);
    }
}

调用这两个函数并等待它们完成。然后处理结果：

Promise.all([fetchCafes(), fetchPlaces()]).then(arr => {
    const cafes = arr[0];
    const places = arr[1];
    // merge them here...
});

推荐阅读