试想一下,我们有一个getJSON方法,该方法发送一个异步请求JSON数据,并返回一个promise对象。这个promise对象的resolve方法传递异步获得的JSON数据。具体例子的使用如下:
<script>在使用async/await时,写法如下:
const makeRequest = () =>
getJSON()
.then(data => {
console.log(data)
return "done"
})
makeRequest()
</script>
<script>对比两种写法,针对第二种,我需要进一步说明:
const makeRequest = async () => {
console.log(await getJSON())
return "done"
}
makeRequest()
</script>
1)第二种写法(使用async/await),在主体函数之前使用了async关键字。在函数体内,使用了await关键字。当然await关键字只能出现在用async声明的函数体内。该函数会隐式地返回一个Promise对象,函数体内的return值,将会作为这个Promise对象resolve时的参数。
可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。
2)示例中,await getJSON() 说明console.log的调用,会等到getJSON()返回的promise对象resolve之后触发。
我们在看一个例子加强一下理解,该例子取自阮一峰大神的《ECMAScript 6 入门》一书:
function timeout(ms) {上面代码指定50毫秒以后,输出hello world。
return new Promise((resolve) => {
setTimeout(resolve, ms);
});
}
async function asyncPrint(value, ms) {
await timeout(ms);
console.log(value);
}
asyncPrint('hello world', 50);
Async/await是近些年来JavaScript最具革命性的新特性之一。他让读者意识到使用Promise存在的一些问题,并提供了自身来代替Promise的方案。
当然,对这个新特性也有一定的担心,体现在:
他使得异步代码变的不再明显,我们好不容易已经学会并习惯了使用回调函数或者.then来处理异步。新的特性当然需要时间成本去学习和体会;
退回来说,熟悉C#语言的程序员一定会懂得这些学习成本是完全值得的。
网友回复
腾讯混元模型广场里都是混元模型的垂直小模型,如何api调用?
为啥所有的照片分辨率提升工具都会修改照片上的图案细节?
js如何在浏览器中将webm视频的声音分离为单独音频?
微信小程序如何播放第三方域名url的mp4视频?
ai多模态大模型能实时识别视频中的手语为文字吗?
如何远程调试别人的chrome浏览器获取调试信息?
为啥js打开新网页window.open设置窗口宽高无效?
浏览器中js的navigator.mediaDevices.getDisplayMedia屏幕录像无法录制SpeechSynthesisUtterance产生的说话声音?
js中mediaRecorder如何录制window.speechSynthesis声音音频并下载?
python如何直接获取抖音短视频的音频文件url?