作为开发来讲，异常处理如同家常便饭。只要写就一定会出错，这是一定的。那面对海量的错误，我们应该怎么处理，又有哪些一定要处理呢？

为什么要处理异常？

因为客户，更因为产品竞争力。异常的产生，在开发环境来说还好，但是放到生产上，那就是毁天灭地的大事。甚至可能丧失一大部分客户，往小说也是在消磨客户对公司的耐心。

需要处理哪些异常？

现在想想，需要处理的异常还真不少。原则就是尽可能处理任何错误。总结如下：

  • 页面崩溃和卡顿
  • 浏览器跨域问题
  • 语法类型错误
  • 接口报错，对前端来说。虽不能减少，但是要尽量降低影响。
  • 资源请求问题

万能解法的隐患

上面的所有问题，对于前端来说有一个万能解决技巧。那就是try-catch语法。所以，绝大部分问题都可以使用try-catch解决，但是也有些隐患提前掌握下。

try-catch只能捕获同步的运行错误，对语法和异步错误无能为力。例如：

// 对同步执行的错误捕获
try {
    const name = 'yaoshen';
    console.log(age);
} catch(error) {
    console.log('错误原因是：', error);
}

错误捕获输出：

错误原因是： ReferenceError: age is not defined
    at <anonymous>:3:21

但是，不能捕获到语法类型错误。

// catch你捕获不到我
try {
  let name = yaoshen';
  console.log(age);
} catch(error) {
    console.log('错误原因是：', error);
}

异常输出：

VM574:2 Uncaught SyntaxError: Invalid or unexpected token

这里可以看到，异常的输出，并不来自catch的捕获。而是直接语法报错了。

非同步的js执行报错

try {
  setTimeout(() => {
    'yaoshen'.set(666);
  }, 996)
} catch(error) {
    console.log('错误原因是：', error);
}

这里的控制台报错如下：

VM911:3 Uncaught TypeError: "yaoshen".set is not a function
    at <anonymous>:3:15

通过这个例子，可以得出结论。异步执行中的错误，不会被catch捕获。

总结语

本文从提出问题，到解决问题。并且详细的梳理了try-catch的使用方法，以及能被捕获的异常。当然，更需要注意的是不能被捕获的地方。希望这里能帮大家避坑。

时间是一切财富中最宝贵的财富。 ——德奥弗拉斯多