如何操作错误_JavaScript中try…catch如何捕获和处理错误

11次阅读

trycatch仅捕获运行时错误,无法捕获语法错误;catch参数必须是单个标识符finally中return会覆盖try/catch的返回值;异步错误须用await或.catch()捕获。

如何操作错误_JavaScript中try…catch如何捕获和处理错误

try…catch 捕获的是运行时错误,不是语法错误

javaScript 的 try...catch 只能捕获在执行阶段抛出的错误(比如 ReferenceErrorTypeErrorRangeError),无法捕获写错的 if 缺少括号、function 拼错成 funtion 这类语法错误——它们在解析阶段就报错,根本进不了 try 块。

常见误判场景:

  • jsON.parse('{ "name": }') 放进 try 是有效的,会捕获 SyntaxError
  • 但把 const obj = { a: 1, }(带尾逗号)这种合法语法误认为会报错,其实不会 —— ES5+ 已支持对象/数组尾逗号
  • eval('alert(') 会触发 SyntaxError,可被捕获;而直接写 alert( 在顶层会直接中断解析,不进 try

catch 参数必须是标识符,不能是解构或默认值

ES2019 规范明确要求 catch 后面的参数只能是单个标识符(如 erre),不能写成 catch({ message })catch(err = new Error()),否则 SyntaxError。

正确写法示例:

立即学习Java免费学习笔记(深入)”;

try {   throw new TypeError('Invalid type'); } catch (err) {   console.log(err.message); // 'Invalid type'   console.log(err.name);    // 'TypeError' }

如果想快速取 messagestack,必须先声明变量再解构:

try {   json.parse('{"a":}'); } catch (err) {   const { message, stack } = err;   console.error(`Parse failed: ${message}`); }

finally 不会阻止 return,但会覆盖 return 值

trycatch 中有 return,而 finally 里也有 return,最终返回的是 finally 的值 —— 这点容易被忽略,尤其在封装工具函数时。

典型陷阱:

  • try { return 1; } catch {} finally { return 2; } → 实际返回 2
  • try { return { ok: true }; } finally { console.log('cleanup'); } → 返回对象,finally 无 return 则不影响
  • 异步操作中误在 finallyreturn promise.resolve(),会导致函数变成返回 Promise,而非预期值

async/await 错误不能靠外层同步 try…catch 捕获

这是最常踩的坑:用同步 try...catch 包裹一个 async 函数调用,却没加 await,结果错误完全漏掉。

错误写法:

try {   someAsyncFn(); // 忘了 await!错误被吞掉,或抛到 unhandledrejection } catch (err) {   console.error(err); // 永远进不来 }

正确做法只有两种:

  • awaitawait someAsyncFn()
  • .catch() 链式处理:someAsyncFn().catch(err => {...})

注意:即使 someAsyncFn 内部有 try...catch,只要它抛出的是被 reject 的 Promise,外部仍需 await.catch() 才能拦截。

text=ZqhQzanResources