JavaScript错误处理的最佳实践是什么？

Question

我期待开始做我的JavaScript多一点错误的证明,而且我发现很多文档的使用try,catch,finally,和throw,但我不是专家在何时何地抛出错误找一吨的建议.

• 每一段代码都应该包含在try/catch中吗？
• 是否有更多这样的建议,在什么时候应该抓住错误？
• 是否存在提高错误的缺点,而不是让代码在生产中无声地失败？
• 就实现而言,这已经触及SO,但服务器日志JS错误是一种有效的策略吗？
• 关于在我的应用程序中捕获错误,我应该知道的任何其他内容？

我也完全是因为听过有很多章节的书籍或对错误处理的深入解释而玩游戏.雄辩的JavaScript触及了这个问题,但对这个问题并没有很强的规定性或固执己见.

感谢您提出的任何建议!

Answer 1

关于企业JavaScript错误处理的一组非常有趣的幻灯片可以在http://www.devhands.com/2008/10/javascript-error-handling-and-general-best-practices/找到.

简而言之,它总结了:

1. 假设您的代码将失败
2. 将错误记录到服务器
3. 您,而不是浏览器,处理错误
4. 确定可能发生错误的位置
5. 抛出你自己的错误
6. 区分致命错误和非致命错误
7. 提供调试模式

幻灯片更详细,很可能会给你一些方向.

UPDATE

上面提到的演示文稿可以在这里找到:http: //www.slideshare.net/nzakas/enterprise-javascript-error-handling-presentation

Answer 2

雅虎的尼古拉斯扎卡斯 成名在Ajax Experience 2008 上讨论了企业错误处理(幻灯片),其中提出了类似这样的内容:

function log(sev,msg) {
    var img = new Image();
    img.src = "log.php?sev=" +
        encodeURIComponent(sev) +
        "&msg=" + encodeURIComponent(msg);
}

// usage
log(1, "Something bad happened.")

// Auto-log uncaught JS errors
window.onerror = function(msg, url, line) {
    log(1, msg);
    return true;
}

一年后,Nicholas Zakas 在他的博客上发布了一个更新,其中包括一个聪明的模式,可以在生产环境中自动注入错误处理代码(使用面向方面的编程).

当您开始记录window.error调用时,您会注意到两件事:

1. 如果您的网站相当复杂,那么您将记录很多错误
2. 你会看到一堆无用的"window.error in undefined:0"消息

减少日志条目的洪流就像在登录服务器之前测试严重性和/或随机数一样简单:

function log(sev,msg) {
    if (Math.random() > 0.1) return; // only log some errors

    var img = new Image();
    img.src = "log.php?sev=" +
        encodeURIComponent(sev) +
        "&msg=" + encodeURIComponent(msg);
}

处理无用的"window.error in undefined:0"错误取决于您的站点体系结构,但可以尝试识别所有Ajax调用并在出现故障时抛出异常(可能使用stacktrace.js返回堆栈跟踪).

Answer 3

IHMO,您应该像在其他几种语言中一样使用javascript中的错误处理(AFAIK:Python,Java).

为了更好的可读性(可能性能更好,即使我不确定它会产生很大的影响),您应该在以下情况下使用try/catch块:

• 要包装的代码部分是整个算法的关键部分.如果失败,它可以:

  • 在下一部分代码上创建错误(例如因为缺少var ...)
  • 使页面看不到预期的内容(对内容或CSS的影响)
  • 使结果看起来对用户来说很奇怪(对代码行为的影响)

• 您知道您编写的代码与每个浏览器都不兼容

• 您计划代码可能会失败(因为没有其他方法可以检查它是否应该按if ... then ... blocks)
• 而且当您想要在不打扰最终用户的情况下进行调试时

最终,javascript专家可能会提供其他元素.

我的2美分到盒子里,

问候,

马克斯

Answer 4

除了其他答案：一件重要的事情是使用JavaScript 错误对象和window.onerror函数参数中可用的上下文数据。

诸如堆栈跟踪 (errorObject.stack)、文件名、行号和列号之类的东西。请注意，每个浏览器都有一些差异......所以尽你最大的努力来获得好的错误。

控制台对象本身甚至可能存在问题。我使用受此启发的自定义 window.onerror 函数和受此代码启发的特殊函数来跟踪任何给定的标准错误对象。

另一个好处是将 Web 应用程序的版本包含在靠近堆栈跟踪的地方（以便快速安全地复制和粘贴）。您还可以在开发模式下更积极地显示错误（警告...），因为开发人员不会经常监视浏览器控制台，并且可能看不到某些问题。

也使用避免使用throw 'My message'，使用throw new Error('My message')，你甚至可以有自定义错误，阅读这篇文章。

始终为错误添加一些上下文（版本、对象的 id、一些自定义消息，...），并确保区分外部错误（某些外部数据或情况使您的系统失败）和内部错误/assertions（你自己的系统搞砸了），阅读“按合同设计”。

这是一个指南。

还要考虑使用一般的错误处理，比如你的库和框架的拦截器：

• jQuery
• Angular 1.x和http
• 角 2.x
• 你的新涂料框架在这里......