前端面試10：錯誤監控/產品性能體系

這裏有一份簡潔的前端知識體系等待你查收，看看吧，會有驚喜哦~若是以爲不錯，懇求star哈~

課程思惟導圖

Q：前端錯誤分類有哪些？

1. 即時運行錯誤，如代碼錯誤
2. 資源加載錯誤

Q：前端錯誤捕獲方式分別是什麼？

1. 即時錯誤的捕獲方式
   1. try-catch
   2. window.onerror（只能捕獲即時錯誤）
2. 資源加載錯誤的捕獲方式
   1. Object.onerror
   2. performance.getEntries() 拿到全部成功加載資源的集合
   3. Error事件捕獲

Q：如何使用Object.onerror捕獲資源加載錯誤？

（注意：這種錯誤不會冒泡，但能夠捕獲）

window.addEventListener('error', function (e) {
    console.log(e)
}, true);
複製代碼

Q：跨域的JS運行錯誤能夠捕獲麼？錯誤提示是什麼，應該怎麼處理？

能夠捕獲，提示「Script error」，具體錯誤信息沒法得到 解決方案：

1. 客戶端：在script標籤增長crossorigin屬性
2. 服務端：設置JS資源響應頭Access-Control-Allow-Origin

Q：客戶端上報錯誤的基本原理是什麼？

1. 使用Ajax通訊的方式上報
2. 利用Image對象上報：(new Image()).src = "http ://xxx/com/test";