下面是关于ES6中async函数与await表达式的基本用法及示例说明的完整攻略。
什么是async函数与await表达式
在ES6中,async函数是用来简化异步代码的一种新语法,它是Generator函数的语法糖。async函数返回一个Promise对象,可以使用then方法添加回调函数。同时,async函数内部可以使用await表达式,它用于等待一个Promise对象的执行结果,并返回执行结果的值。
async函数和await表达式的基本用法
定义async函数
定义一个async函数使用关键字async。下面是一个简单的示例,当asyncTest函数被调用时,它会返回一个Promise对象。
async function asyncTest(){
return "Hello World"
}
使用await
await表达式只能在async函数中使用,await用于等待一个Promise对象的执行结果,如果Promise对象状态变为resolved,则返回执行结果,否则返回Promise对象状态为rejected的错误信息。
async function asyncTest(){
let result = await Promise.resolve("Hello World")
console.log(result)
}
上面示例中,由于Promise对象状态为resolved,所以await表达式返回Promise对象的执行结果"Hello World",打印出来的结果为"Hello World"。
如果Promise对象状态为rejected,则会抛出错误。比如:
async function asyncTest(){
try{
let result = await Promise.reject("Error")
console.log(result)
}catch(error){
console.log(error)
}
}
上面示例中,由于Promise对象状态为rejected,所以await表达式抛出错误信息"Error",并被catch语句捕获到,打印出来的结果为"Error"。
示例说明
下面通过两个示例说明async函数和await表达式的基本用法。
示例一:获取用户信息
假设我们需要从服务器获取某个用户的信息,我们可以定义一个getUserInfo函数,调用此函数时,会返回Promise对象,可以使用then方法添加回调函数,并获取到用户信息。getUserInfo函数内部使用了await表达式等待Promise对象的执行结果,并返回执行结果。
async function getUserInfo(userId){
let response = await fetch(`https://example.com/api/user/${userId}`)
let data = await response.json()
return data
}
getUserInfo(1)
.then(data => {
console.log(data)
})
.catch(error => {
console.log(error)
})
上面示例中,getUserInfo函数使用了await表达式等待Promise对象的执行结果,如果获取到了用户信息,则返回用户信息,否则返回错误信息。调用getUserInfo函数时,使用了then方法添加回调函数,并获取到了用户信息。
示例二:上传图片
假设我们需要上传一张图片到服务器,上传完成后需要获取上传结果。我们可以定义一个uploadImage函数,调用此函数时,会返回Promise对象,可以使用then方法添加回调函数,并获取到上传结果。uploadImage函数内部使用了Promise对象进行图片上传,并等待Promise对象的执行结果,并返回上传结果。
async function uploadImage(imageData){
let formdata = new FormData()
formdata.append('image', imageData)
let response = await fetch('https://example.com/api/upload', {
method: 'POST',
body: formdata
})
let data = await response.json()
return data
}
let image = document.querySelector('#image').files[0]
uploadImage(image)
.then(data => {
console.log(data)
})
.catch(error => {
console.log(error)
})
上面示例中,uploadImage函数使用了Promise对象进行图片上传,同时使用await表达式等待Promise对象的执行结果,并返回上传结果。调用uploadImage函数时,使用了then方法添加回调函数,并获取到上传结果。
总结
通过以上示例可以看出,ES6中async函数与await表达式可以简化异步代码的编写,并让异步代码更加易读、易维护。同时,使用async函数和await表达式,可以大大提高异步代码的性能和稳定性。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:ES6中async函数与await表达式的基本用法举例 - Python技术站