如何可靠地触发JavaScript的rejectionhandled事件？

javascript rejectionhandled 事件触发机制详解

rejectionhandled 事件仅在以下条件同时满足时才会被触发：一个非顶级 Promise 被拒绝，并且该拒绝没有被 catch 语句捕获。 关键在于，该事件的触发时机是在宏任务队列执行完毕之后。

排查rejectionhandled 事件触发失败的原因

您可能无法触发 rejectionhandled 事件，原因可能如下：

• Promise 不是非顶级 Promise: 如果 Promise 是顶级 Promise（直接在全局作用域中创建或作为顶级函数的返回值），则不会触发 rejectionhandled 事件。
• 错误被 catch 捕获: 如果 Promise 的 reject 函数抛出的错误被 catch 语句捕获，则不会触发 rejectionhandled 事件。
• 测试环境问题: 在浏览器控制台中直接运行代码测试可能无法正确模拟宏任务的执行顺序，导致事件无法触发。 建议将代码嵌入到 HTML 文件的 <script></script> 标签中运行。
• catch 执行时机过早: catch 语句必须在宏任务结束后才执行，才能触发 rejectionhandled 事件。

可靠触发 rejectionhandled 事件的解决方案

立即学习“Java免费学习笔记（深入）”；

md2card

Markdown转知识卡片

1995

查看详情

为了可靠地触发 rejectionhandled 事件，请遵循以下步骤：

1. 创建非顶级 Promise: 确保 Promise 不是顶级 Promise。
2. 延迟 catch 的执行: 使用 setTimeout 或 Promise 链中的 then 方法延迟 catch 的执行，确保其在宏任务结束后执行。
3. 在实际代码环境中测试: 将代码嵌入到 HTML 文件中运行，避免在浏览器控制台中直接测试。

示例代码：可靠触发 rejectionhandled 事件

以下代码演示了如何可靠地触发 rejectionhandled 事件：

<code class="javascript">// 创建一个非顶级 Promise，并延迟拒绝
const promise = new Promise((resolve, reject) => {
  setTimeout(() => reject("Promise rejected!"), 1000);
});

// 延迟执行 catch 处理，确保在宏任务结束后执行
setTimeout(() => {
  promise.catch(error => {
    console.log("Caught in catch block:", error); // 此处会先打印
  });
}, 2000);


// 添加 rejectionhandled 事件监听器
window.addEventListener('rejectionhandled', event => {
  console.log('rejectionhandled event triggered:', event.reason); // 此处会在 catch 后打印
}, false);</code>

这段代码中，catch 的执行被延迟了 2000 毫秒，确保 rejectionhandled 事件在宏任务结束后被触发。 您将会看到控制台先打印 Caught in catch block，然后打印 rejectionhandled event triggered。 这证明 rejectionhandled 事件被成功触发。 请将此代码嵌入到 HTML 文件中运行以获得最佳结果。

以上就是如何可靠地触发JavaScript的rejectionhandled事件？的详细内容，更多请关注php中文网其它相关文章！