js 监听iframe 内部接口是否请求完成_JS的艺术，前端异常捕获技术大全。

前端异常捕获，技术大纲

1. 可疑区域增加 try...catch
2. 全局监控JS异常： window.onerror
3. 全局监控静态资源异常： window.addEventListener
4. 全局捕获没有 catch 的 promise 异常：unhandledrejection
5. iframe 异常：window.error
6. VUE errorHandler 和 React componentDidCatch
7. 监控网页崩溃：window 对象的 load 和 beforeunload
8. Script Error跨域 crossOrigin 解决

作为一个前端开发人员，每次看到浏览器控制台信息里面红通通的报错信息是不是都很紧张？
不要怕，下面我们就来讨论一下前端的异常捕获。
异常捕获
异常捕获，相对于其他知识点可能没那么被重视，特别是对于前端程序员。但不得不说，这又是一个不得不面对的知识点。
为什么要捕获异常？

首先，我们为什么要进行异常捕获和上报呢？
正所谓百密一疏，用程序员的话来说就是：天下不存在没BUG的程序。
即使经过各种测试，还是会存在十分隐蔽的BUG，这种不可预见的问题只有通过完善的监控机制才能有效的减少其带来的损失。因此，对于最接近用户的前端来说，为了能远程定位问题、增强用户体验，异常的捕获和上报至关重要。
对于前端编程来说，用JS捕获异常，是最适合、最方便的，都是JS。
我们面对的仅仅只是异常，异常的出现不会直接导致JS引擎崩溃，最多只是终止当前代码的执行。下面来解释一下这句话：
<script>
error // 没定义过的变量，此处会报错
console.log('永远不会执行');
</script>
<script>
console.log('我继续执行')
</script>
下面针对不同异常的捕获一一分析：
try...catch 的误区
try...catch只能捕获到同步的运行时错误，对于语法和异步错误无能为力，捕获不到。
1.同步运行时错误
try {
let name = 'Jack';
console.log(nam);
} catch(e) {
console.log('捕获到异常：',e);
}
输出：
捕获到异常： ReferenceError: nam is not defined
at <anonymous>:3:15
2.不能捕获语法错误，我们修改一个代码，删掉一个单引号
try {
let name = 'Jack;
console.log(nam);
} catch(e) {
console.log('捕获到异常：',e);
}
输出：
Uncaught SyntaxError: Invalid or unexpected token
语法错误SyntaxError，不管是window.error还是try...catch都没法捕获异常。但是不用担心，在你写好代码按下保存那一刻，编译器会帮你检查是否有语法错误，如果有错误有会有个很明显的红红的波浪线，把鼠标移上去就能看到报错信息。因此，面对SyntaxError语法错误，一定要小心小心再小心