为什么说大多数 JavaScript 工程师写的错误处理都有问题-程序员宅基地

程序是从上到下顺序执行的，同时可以通过一些控制语句来改变执行的路线，受控制语句影响下，程序最终的执行路线就是控制流。

js 里面的控制语句有 if、for、while、try catch 等，它们都会改变程序的走向。

程序是操作数据的，随着程序的运行，也就是控制流的前进而改变的数据叫做数据流。

很明显，数据流是依赖控制流的，程序分析里面的数据流分析也是要先做控制流分析。

比如这样一段代码：

const a = 1;
let b;

if (a === 1) {
    b = '1111';
} else {
    b = '2222';
}

因为 a 为 1，所以会执行到 b = '1111';，这就是控制流，也就是程序最终执行的代码，可以用来分析程序的走向，做一些死代码删除之类的优化。

而随着控制流的执行，b 会被赋值为 2222，这就是数据流，也就是值的变化的过程，可以用来分析某个语句的变量的值。

程序是针对不同数据做不同的处理，如果数据有错误，那么处理程序也就没法处理了，就会报错，会中断后续的控制流。比如数据为空、数据格式不对等等。这时候就要通过 try catch 做错误处理，也叫异常处理。

我们做异常处理有两个目的：

对出错的逻辑做一些兜底处理。

比如参数解析有错误的时候，在 catch 里赋一个默认值。这种错误处理之后就没必要再报出来了。这种情况下 try catch 也是作为逻辑的一部分，相当于 if else。

对报的错做更场景化的描述。

JS 的报错是 JS 引擎抛出的，比如调用了一个 null 对象的方法会报 TypeError，使用了未声明的变量会报 ReferenceError。而具体的 Error 是在不同场景下报出的，就有不同的含义：

如果这个对象是来自用户输入的，那就是用户输入的有错误，如果这个对象是从服务端获取的，那就意味着服务端返回的数据有错误。在不同的场景下，同一个 Error 会有更具体的含义，所以我们要做 try catch。然后抛出一个自定义的错误，包含有场景信息的错误描述。

这点很多库和框架做的都比较好，报出的错都是有具体的场景信息，甚至还有解决方式，而且还有的通过错误编号做了管理，可以通过 errorno 来查询解决方式。这种就是对错误做了自定义的处理。

而很多业务代码中报的错就并没有做这种处理，是直接把原生 Error 给报出来了。我们会通过异常监控平台来收集一些 throw 到全局的错误，而这些错误往往都是比较原始的信息，虽然带上了错误位置和堆栈，但还要通过看源码来定位问题。

比如报了一个对象为空的错误，但是我怎么知道这是什么对象为空，会是什么原因，怎么解决，有没有编号。

如果我们能够对各种错误 catch 之后 throw 出一些具体场景的自定义错误，那是不是就好的多了。这点第三方库都做得很好，而业务代码很少有人注重场景化的自定义错误。

当然，前端业务代码的用户是通过界面来使用该软件的，其实只要对各种错误做一些 UI 上的提示就可以。而库的代码是给开发者用的，那么就要对各种错误做场景化的描述，甚至给错误编号并给出解决方案。

但我觉得业务代码也应该像第三方库代码那样来对待错误，不要把没有啥意义的原生错误报出来，而是报一些有具体含义的自定义错误，这样排查和解决问题就会简单很多。

不过虽然场景化的自定义错误可以更好的帮助排查问题，那也一定是建立在对该段代码可能报的错误有把握的情况下。要是自己报出的错误信息和实际的错误原因不一样，反而会增加排查问题的难度，还不如把原生错误报出来。

总结

程序执行的流程是控制流，受控制语句影响，执行的过程中会改变数据，数据的变化叫做数据流，控制流和数据流是程序分析里面经常分析的两个方面。

错误会中断控制流，我们要对错误做一些处理，通过 try catch。

错误处理有两个目的：

一个是做一些兜底的处理，相当于 if else，不需要再把错误报出来。

一个是做对原生的 JS 错误做场景化的描述，创建一个有更具体信息的错误对象抛出来。

这点很多库做的很好，甚至还会给错误编号并给出解决方式。但业务代码其实很多只做了给用户的 UI 上的反馈，没有对抛出的错误做场景化的包装。这就导致了错误监控平台收集到的错误都是比较原始的错误，需要查看源码来排查。如果也能像库的代码那样做一些场景化的错误包装，统计和排查起问题来会容易很多，这点大多数 Javascript 工程师都没做到。

本文链接：https://blog.csdn.net/weixin_39843414/article/details/120465616

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

c# 调用c++ lib静态库_c#调用lib-程序员宅基地

文章浏览阅读2w次，点赞7次，收藏51次。四个步骤1.创建C++ Win32项目动态库dll 2.在Win32项目动态库中添加外部依赖项 lib头文件和lib库3.导出C接口4.c#调用c++动态库开始你的表演...①创建一个空白的解决方案，在解决方案中添加 Visual C++ , Win32 项目空白解决方案的创建：添加Visual C++ , Win32 项目这......_c#调用lib

deepin/ubuntu安装苹方字体-程序员宅基地

文章浏览阅读4.6k次。苹方字体是苹果系统上的黑体，挺好看的。注重颜值的网站都会使用，例如知乎：font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, W..._ubuntu pingfang

html表单常见操作汇总_html表单的处理程序有那些-程序员宅基地

文章浏览阅读159次。表单表单概述表单标签表单域按钮控件demo表单标签表单标签基本语法结构<form action="处理数据程序的url地址“ method=”get|post“ name="表单名称”></form><!--method将表单中的数据传送给服务器处理，get方式直接显示在url地址中，数据可以被缓存，且长度有限制；而post方式数据隐藏传输，_html表单的处理程序有那些

PHP设置谷歌验证器（Google Authenticator）实现操作二步验证_php otp 验证器-程序员宅基地

文章浏览阅读1.2k次。使用说明:开启Google的登陆二步验证（即Google Authenticator服务）后用户登陆时需要输入额外由手机客户端生成的一次性密码。实现Google Authenticator功能需要服务器端和客户端的支持。服务器端负责密钥的生成、验证一次性密码是否正确。客户端记录密钥后生成一次性密码。下载谷歌验证类库文件放到项目合适位置(我这边放在项目Vender下面)https://github.com/PHPGangsta/GoogleAuthenticatorPHP代码示例://引入谷_php otp 验证器

【Python】matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距-程序员宅基地

文章浏览阅读4.3k次，点赞5次，收藏11次。matplotlib.plot画图横坐标混乱及间隔处理_matplotlib更改横轴间距

docker — 容器存储_docker 保存容器-程序员宅基地

文章浏览阅读2.2k次。①Storage driver 处理各镜像层及容器层的处理细节，实现了多层数据的堆叠，为用户提供了多层数据合并后的统一视图②所有 Storage driver 都使用可堆叠图像层和写时复制（CoW）策略③docker info 命令可查看当系统上的 storage driver主要用于测试目的，不建议用于生成环境。_docker 保存容器

随便推点

网络拓扑结构_网络拓扑csdn-程序员宅基地

文章浏览阅读834次，点赞27次，收藏13次。网络拓扑结构是指计算机网络中各组件（如计算机、服务器、打印机、路由器、交换机等设备）及其连接线路在物理布局或逻辑构型上的排列形式。这种布局不仅描述了设备间的实际物理连接方式，也决定了数据在网络中流动的路径和方式。不同的网络拓扑结构影响着网络的性能、可靠性、可扩展性及管理维护的难易程度。_网络拓扑csdn

JS重写Date函数，兼容IOS系统_date.prototype 将所有 ios-程序员宅基地

文章浏览阅读1.8k次，点赞5次，收藏8次。IOS系统Date的坑要创建一个指定时间的new Date对象时，通常的做法是：new Date("2020-09-21 11:11:00")这行代码在 PC 端和安卓端都是正常的，而在 iOS 端则会提示 Invalid Date 无效日期。在IOS年月日中间的横岗许换成斜杠，也就是new Date("2020/09/21 11:11:00")通常为了兼容IOS的这个坑，需要做一些额外的特殊处理，笔者在开发的时候经常会忘了兼容IOS系统。所以就想试着重写Date函数，一劳永逸，避免每次ne_date.prototype 将所有 ios