JS函数异步返回值的处理

书中仙
2019.03.25 23:47 字数 1521 阅读 59 评论 0 喜欢 0

我们在项目中可能经常会需要定义一个函数,传入某些参数,返回某个值,如果这个函数中的过程是同步的,那没有任何问题,但是如果这个过程是异步的那就有问题了。

直接在异步的方法里写return肯定是不行的,就像下面这种

        function getNumber () {
setTimeout(() => {
let r = 2
return r
}, 1000);
}
console.log(getNumber()) // undefined

其实有一种解决办法,也是我们大多数人用的方法,就是传个callback进去

       function getNumber (callback) {
setTimeout(() => {
let r = 2
callback(r)
}, 1000);
}

getNumber(function(n){
console.log(n) /* 2 */
})

但是这不是我们想要的效果,我们想要的效果是返回一个值

这时候我们就想到用 async await 能否实现这一效果

        function getNumber() {
return new Promise((resolve, reject) => {
setTimeout(() => {
let r = 2
resolve(r)
}, 1000);
})
}

async function compute() {
let code = await getNumber();
console.log(code) /* 2 */
}

compute()

这时候我们在compute函数里可以拿到code,但是这里需要注意一个问题

        function getNumber() {
return new Promise((resolve, reject) => {
setTimeout(() => {
let r = 2
resolve(r)
}, 1000);
})
}

async function compute() {
let code = await getNumber();
return code
}

console.log(compute()) // Promise

如果我们这么写,在compute函数里再return code,我们直接输出compute,得到的是一个Promise对象,也就是说await关键字是阻塞不了return的,return会在Promise执行之前触发,这一点需要特别注意

支付二维码
登录 后发表评论
${comment_count}条评论 评论

智慧如你,不想发表一点想法咩~

推荐阅读
更多精彩内容