以用户为中心的 API 异常设计
设置一个元素的高度:
var elem = document.getElementById('some-id'), val = '200px'; elem.style.height = val; // 原生写法 YAHOO.util.Dom.setStyle(elem, 'height', val); // YUI2 写法 $(elem).height(val); // jQuery 写法
当val = '200px'
时,以上三种写法都能正确工作。
当val = '200xx'
时,以上三种写法在 IE 下都抛出异常,在非 IE 下被忽略。
当val = '-200px'
时,以上三种写法在 IE 下前两种抛异常,jQuery 忽略。
由于 height 值在不少使用场景下是动态计算出来的,比如淘宝宝贝详情页,就有如下代码:
YUD.setStyle(switchTrigger, 'height', viewportHeight + docScrollTop - detailTop + 'px');
在某些特定情况下,viewportHeight + docScrollTop - detailTop
是负数,于是 悲剧就产生了:IE 下,将会抛出异常,导致后续代码都不再执行。(这是一个真实的故事,淘宝的部分宝贝详情页,在发这篇文章之前,就因为该异常而导致部分功能不可用)
对于前端类库来说,在设计异常时,要尽可能考虑周全:
1. 异常的作用,是给程序员排查和定位错误用。对于线上代码来说,要尽可能的将异常设计为不打扰方式。比如在特定参数开启下,才会抛出或以 log 的形式输出。
2. 要特别小心浏览器自身 API 异常的不良设计。比如 IE 下对 style.height 非有效值的处理上,就不如其它浏览器。
3. 当然,该抛的异常还是得毫不犹豫抛出来。比如null.method()
,所有浏览器都会告诉你错了。类库的 API 在某些场景下也需如此设计,以让开发者第一时间内发现问题。
两句话概括 API 的异常设计原则:
1. 当某个异常不会导致后续代码不可执行时,这种异常在设计时,要尽可能不打扰用户;
2. 当某个异常会严重导致后续代码不可执行并产生不可预期的隐患时,就大胆抛出来。
简言之,就是 API 设计要以用户为中心,包括页面浏览者、类库使用者和类库开发者。
本文出自 传播、沟通、分享,转载时请注明出处及相应链接。
本文永久链接: https://www.nickdd.cn/?p=752