javascript中的错误处理怎样进行【教程】

javaScript错误处理需分同步、异步和全局三类：同步错误用try…catch捕获；异步错误须在promise链或async/await中显式处理；全局错误通过window.onError和unhandledrejection监听补漏，并按类型分级上报。

javascript 错误处理不是靠“加个 try...catch 就万事大吉”，关键看你在哪个环节、处理哪类错误、是否影响用户可感知的行为。

同步代码出错：必须用 try...catch 捕获

只有 throw、运行时异常（如 undefined.foo()）、jsON.parse() 解析失败等同步抛出的错误，才能被 try...catch 拦住。

• 不能捕获异步回调里的错误（比如 setTimeout(() => { throw new Error() })）
• catch 块中别再抛未处理的错误，否则会静默丢失——至少打个 console.error(e)
• 不要只写 catch(e) { } 空处理，掩盖问题；也不建议无差别 catch 所有错误后继续执行逻辑

try {   const data = json.parse(input);   render(data); } catch (e) {   if (e instanceof SyntaxError) {     showErrorMessage('JSON 格式错误');   } else {     console.error('解析意外失败:', e);   } }

异步操作出错：Promise 链上必须接 .catch() 或用 await + try...catch

fetch、axios、自定义 Promise 等，错误不会冒泡到外层同步 try...catch，必须在 Promise 链里显式处理。

• fetch 成功返回 Response 对象，但 http 错误码（如 404、500）不会触发 reject，得手动检查 response.ok
• async/await 写法下，await 后面的 Promise reject 会被 catch 捕获，但仅限同一函数作用域内
• 避免 .then(success).catch(handleError) 这种写法漏掉 success 回调里的新错误（它内部再抛错就没人管了）

async function loadData() {   try {     const res = await fetch('/api/data');     if (!res.ok) throw new Error(`HTTP ${res.status}`);     return await res.json();   } catch (e) {     // 这里能捕获 fetch 失败、JSON 解析失败、手动 throw 的错误     reportError(e);     throw e; // 如果上层还要处理，记得 re-throw   } }

全局未捕获错误：用 window.onerror 和 window.addEventListener('error') 补漏

它们捕获的是完全没被任何 try/catch 或 .catch() 拦住的错误，比如：

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

• 脚本加载失败（）
• 跨域 script 的语法错误（此时 error.message 是空字符串）
• 资源加载失败触发的 ErrorEvent（注意：不是所有资源错误都走这里，图片失败走 onerror 属性）

注意：window.onerror 无法捕获 Promise reject 未处理的情况；要监听后者，必须用 window.addEventListener('unhandledrejection', ...)。

window.addEventListener('unhandledrejection', event => {   // event.reason 是 Promise.reject() 传入的值，可能是 Error 实例，也可能只是字符串   if (event.reason instanceof Error) {     reportError(event.reason, 'unhandledRejection');   } });

错误分类与上报：别把网络超时和用户输入错误当成同一回事

真实项目里，你得区分错误来源和严重程度，否则监控系统全是噪音。

• 用户侧错误（如表单校验失败）不该进错误监控，该走业务埋点
• 网络错误（TypeError: Failed to fetch）、解析错误（SyntaxError）、引用错误（ReferenceError）优先级高，需立即告警
• 同一个错误在 1 分钟内重复 10 次以上，大概率是代码缺陷，不是偶发网络抖动
• 上报前脱敏：去掉 URL 中的 Token、用户 ID，不传 stack 里的敏感路径（如本地开发路径 /Users/xxx/...）

最常被忽略的一点：error.stack 在不同浏览器里格式不一致，直接上报前最好用 stacktrace-js 或简单正则归一化，否则聚合分析会失效。