点击 一键订阅《云荐大咖》专栏，获取官方推荐精品内容，学技术不迷路！
文章图片
健壮性(Robustness) 是指程序在遇到规范以外的输入，错误和异常时，仍能正常运行。简单来说，健壮代码的适应性很强，不会因为一些异常，就导致程序崩溃。
不健壮的前端代码体现为：
接口返回异常或报错时，页面白屏。
用户做一些非常规操作时，页面白屏。
如何写出健壮的前端代码 要写出健壮的前端代码，就要处理规范以外的输入，错误和异常。具体来说，有 4 点：
1.异常处理。
2.输入检查。
3.写法优化。
4.第三方库的选择。
下面，我们具体来说。
1. 异常处理
不做异常做处理，轻则导致功能出错，重则导致页面白屏。异常处理，可以分为如下几种情况。
主动捕获运行时异常
用 try-catch 捕获同步代码的运行时错误。如果是异步代码，需要转化成 await 的写法。如:
try {
doSth()
await doSth2()
} catch (e) {
// 处理异常
}处理意料之外的全局运行时异常
未被处理的 JavaScript 运行时错误（包括语法错误）发生时, window 会触发 error 事件。这么处理:
window.addEventListener(
'error',
(e) => {/* 处理异常 */}
)当一项资源（如
文章图片
提升代码质量的下一步 提升代码质量的下一步就是提升代码的可读性。我会在下一篇文章中介绍。
文章图片
金伟强往期精彩文章推荐：
聊聊代码质量 - 《学得会，抄得走的提升前端代码质量方法》前言
代码质量第 5 层 - 只是实现了功能
【代码质量第 4 层 - 健壮的代码】
文章图片
《云荐大咖》是腾讯云加社区精品内容专栏。云荐官特邀行业佼者，聚焦于前沿技术的落地及理论实践之上，持续为您解读云时代热点技术、探索行业发展新机。点击一键订阅，我们将为你定期推送精品内容。
推荐阅读
- web网页模板|如此优秀的JS轮播图，写完老师都沉默了
- 接口|axios接口报错-参数类型错误解决
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- JavaScript|JavaScript — 初识数组、数组字面量和方法、forEach、数组的遍历
- JavaScript|JavaScript — call()和apply()、Date对象、Math、包装类、字符串的方法
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export
- vue|Vue面试常用详细总结
- javascript|vue使用js-xlsx导出excel，可修改格子样式，例如背景颜色、字体大小、列宽等
- css|我用css精灵图拼接了自己的英文名字，不会还有人不知道精灵图技术吧（）
- css|css三角的做法及其案例