<div class="box" onclick="boxClick()"></div>
<script>
// async await 运用 await加在事件前面,那么他们都会按照顺序执行
async function boxClick() {
await setTimeout(console.log("1st runing"), 3000);
await console.log("2nd runing");
}
// 打印结果 1st runing
// 2nd runing
// 使用promise 让两个事件按数据集女婿执行
const f1 = ()=>new Promise((resolve, reject)=>{
setTimeout(()=>{
console.log('p1 runing')
resolve(1)
}, 1000)
})
const f2 = ()=>new Promise((resolve, reject)=>{
setTimeout(()=>{
console.log('p2 runing')
resolve(2)
}, 1000)
})
// 使用回调形式
f1().then(()=>{
f2()
})
异步编程与Promise:顺序执行示例解析
本文探讨了如何使用async/await和Promise确保JavaScript中的异步操作按顺序执行。通过示例展示了await关键字如何搭配setTimeout实现延迟操作的顺序等待,以及Promise链式调用保证任务依次完成。理解这些概念对于优化异步代码的结构和性能至关重要。
1575

被折叠的 条评论
为什么被折叠?



