Async/Await中如何优雅地退出不确定时间回调函数?
2024-11-20 15:27:44
0浏览
收藏
有志者,事竟成!如果你在学习文章,那么本文《Async/Await中如何优雅地退出不确定时间回调函数?》,就很适合你!文章讲解的知识点主要包括,若是你对本文感兴趣,或者是想搞懂其中某个知识点,就请你继续往下看吧~

在async await中退出不确定时间回调函数
问题:
使用async await时,如何在监听不确定时间回调函数中的事件时退出?
示例代码:
const a = (): promise<void> => {
// 监听按钮的属性变化
return new promise((resolve) => {
const callback = (mutations: mutationrecord[]) => {
// 退出
resolve();
};
const observer = new mutationobserver(callback);
observer.observe(buttonel, {
attributes: true,
});
// 触发按钮点击事件并监听属性变化
p().then(() => {
buttonel.click();
});
});
};
const b = async (): promise<void> => {
// 监听按钮的属性变化,如何退出?
const callback = (mutations: mutationrecord[]) => {};
const observer = new mutationobserver(callback);
observer.observe(buttonel, {
attributes: true,
});
// 触发按钮点击事件并监听属性变化
await p();
buttonel.click();
};解决方案:
使用最新的promise.withresolvers()接口,目前处于stage-4阶段。
const b = async (): Promise<void> => {
// 创建 Promise 实例
const { promise, resolve } = Promise.withResolvers<void>();
// 设置回调和观察器
const callback = (mutations: MutationRecord[]) => {
resolve();
};
const observer = new MutationObserver(callback);
observer.observe(buttonEl, {
attributes: true,
});
// 触发按钮点击事件并监听属性变化
await p();
buttonEl.click();
// 使用 await promise 或 return promise 返回 Promise
await promise;
};考虑兼容性,可能需要更新core-js和typescript版本。
以上就是《Async/Await中如何优雅地退出不确定时间回调函数?》的详细内容,更多关于的资料请关注golang学习网公众号!
Head First Java中多个线程同时取款,为什么会出现余额不足的问题?
- 上一篇
- Head First Java中多个线程同时取款,为什么会出现余额不足的问题?
- 下一篇
- win11自动清空回收站怎么设置 win11设置自动清空回收站教程
查看更多
最新文章
-
- 文章 · 前端 | 1小时前 |
- JavaScript日期格式化方法全解析
- 325浏览 收藏
-
- 文章 · 前端 | 1小时前 |
- HTML5边框定位不占位技巧
- 405浏览 收藏
-
- 文章 · 前端 | 1小时前 |
- CSSLint优化技巧与样式提升方法
- 413浏览 收藏
-
- 文章 · 前端 | 1小时前 |
- CSSSticky定位技巧:滚动与固定结合应用
- 293浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- 统一图标风格,FontAwesome全站应用指南
- 356浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- JavaScript动态加载模块技巧解析
- 119浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- LinuxHelix加速技巧与重构指南
- 182浏览 收藏
-
- 文章 · 前端 | 2小时前 | 顶层await
- 顶层await用法详解与实战技巧
- 288浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- 表单数据保留与自动清理技巧
- 120浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- EventLoop机制解析与执行顺序控制技巧
- 392浏览 收藏
-
- 文章 · 前端 | 2小时前 |
- Tailwind任意值类解决方法详解
- 321浏览 收藏
-
2. CSS 样式使用 ::after 伪元素来在图片上叠加文字:
.im">

