如何解决使用console.log进行异步等待可以工作,但是当我尝试使用return语句时,我得到的是承诺吗?
我希望有人可以在这里指出我的错误方式。
我目前有两个职能。一个是getData
,它是一个异步函数,仅使API调用即可请求数据。第二个函数是getRandomCategories
,它封装了getData
函数调用,并将该异步操作的值保存在名为res
的变量中。 getRandomCategories
中的其余代码将响应数据操纵为一个数字数组,其中每个数字代表一个类别。
当我在getRandomCategories
函数中使用调试器语句时(正好在try块中的return语句之前),我从名为apiCallCategoryArray的变量中获得了期望的数据类型-它是一个数字数组每个代表一个类别。生活是美好的。
这是我不了解的内容:如果您看一下代码片段底部的两个函数调用(test()
和testAgain()
,它们本质上是相同的函数,但是名称不同我可以并排比较它们)我可以在console.log(res)
中的test()
中使用预期的返回值(数字数组),但是当我尝试返回res
(在testAgain()
)变量myData2
不包含数字数组(正如我期望的那样),而是包含:Promise { <state>: "pending" }
下面是我的代码:
async function getData(endpoint,query,value) {
return await axios.get(
`http://jservice.io/api/${endpoint}?&${query}=${value}`
)
}
// createa a function that will return 6 random categories
async function getRandomCategories(data) {
try {
const res = await getData('categories','count',50)
const data = res.data;
const categories = filterCategoryData(data); // I'm filtering for categories
const categoryIdArr = mapCategoryIds(categories); // an array of just category Ids
const shuffledCategoryIds = shuffle(categoryIdArr); // shuffles the array
const apiCallCategoryArray = takeFirstXItems(shuffledCategoryIds,6); // takes 6 items
debugger // values are as expected
return apiCallCategoryArray
} catch (err) {
console.log(err);
}
}
// this logs what my expected return value should be
async function test() {
const res = await getRandomCategories()
console.log(res) // Array(6) [ 11518,11537,11533,11512,11542,11506 ]
}
// But when I try to use the return statement so I can use the array
// I'm getting a promise back. This NOT my expected return value??
async function testAgain() {
const res = await getRandomCategories()
return res // return statement instead of console.log()
}
const myData = test() // the console.log within the test function logs the expected data type
console.log(myData) // but if I console.log myData it logs: Promise { <state>: "pending" }
const myData2 = testAgain() // same function but just a different name but this time I'm using a return statement instead of console.log
console.log(myData2) // Promise { <state>: "pending" }
我的问题是:为什么我可以用console.log(res)
中的预期返回值来test()
但是当我使用return语句时(例如testAgain()
),我得到的是Promise {:“ pending”}而不是我期望的数字数组。我应该在哪里调整代码,以便变量保存数字数组而不是Promise?
提前感谢大家的时间。
解决方法
const data = res.data;
在const data = await res.data;
函数中应为getRandomCategories
。另外,const myData2 = testAgain()
应该是const myData2 = await testAgain()
,但由于它是顶级代码,并且需要异步函数,因此您可以将其包装为自调用函数或使用then / catch。
有关异步/等待here的更多信息。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。