Javascript类库的顶层对象名用户体验分析
更新时间：2010年10月24日 19:56:08 作者：
针对jQuery、Ext、KISSY三者类库的对比及分析已经很多了，但多数是从功能和设计的角度切入，因此本篇文章决定换一个特殊的角度，从各类库的顶层对象名的键盘输入的体验上来对这三个类库进行比较。
由于顶级对象是使用类库几乎所有功能的入口，在编码中会频繁地输入这几个字符，因此在设计类库时，顶级对象名输入的简便性也是相当重要的。
在此将从对象名称的长度、输入对象名称的按键顺序这两个方面对三个类库进行重点比较，同时力求照顾到一些特别的点，从而得出一个较为全面的评测结果。
名称长度
jQuery共有6个字符组成，从长度上而言是三个类库中最长的一个，同时包含了一个大写字母Q，在输入过程中需要加入一次SHIFT键，因此长度值给定为7。
Ext共有3个字符组成，在长度上是最有优势的，由于首字母为大写字母E，输入过程中需要有一次SHIFT，因此长度值给定为4。
KISSY由5个字符组成，均为大写字母，长度上而言接近jQuery，同时需要一次SHIFT键的长按，因此给定长度值6。
在名称长度的对比上，最受欢迎的jQuery以微弱的劣势惜败，但jQuery使用了其他的方式在这方面给予了改进，将在后文中提及。
按键顺序
按键顺序的分析比较复杂，这里涉及的原则主要有以下几点
尽可能地交叉使用左右手输入每一个字符。
尽可能避免同一手指连续使用。
尽可能地减少长按某个按键的时间。
食指和中指较为灵活，因此尽可能避免使用小指和无名指。
较为接近的两个手指容易出现联动的现象，即当小指移动时，无名指也会反射性进行微幅度的移动，这可能影响到下一次按键，因此尽可能避免并列的手指连动。
在评测中，将双手从左手小指至右手小指，依次编号为0-9，从数字上观察将会发现一些有趣的现象。
jQuery的按键顺序依次是606236，在输入的过程中
有一次使用了较不灵活的左手小指。
在上一条的基础上补充，事实上在按Q的时候需要用左手小指按住SHIFT键，因此Q其实是交给原本不负责Q键的左手无名指。
在输入大写Q时左手小指和无名指有连动的现象，而且不是顺序连动，而是同时敲击。
e和r由左手中指和食指连续敲击，可能出现并列的手指连动的影响。但是在实际输入过程中，笔者发现食指和中指的连动不但没有效率上的影响，反而对速度有促进作用，反思该过程，发现中指和食指连续敲击桌面是笔者在思考时经常做的动作，因此形成了一种极为高效熟练的反射运动……
Ext的按键顺序依次是213，输入过程中发现有以下问题
所有按键来自左手，右手完全空闲，无法达到理论的最高输入速度。但是由于在输入Ext的过程中，右手可以同时去定位.这个按键，因此对于整行语句的输入影响并不是很大。
输入大写的E时，左手小指需要按住SHIFT键，而紧接着输入x时，左手无名指按下的前瞬间要求小指放开SHIFT键，由于这两个手指很容易出现联动的反映，因此对左手按x键的定位精准性有着较大的影响。
KISSY的按键顺序依次是77116，这大概是几个类库中最糟糕的键位顺序了
出现右手中指、左手无名指连续按键现象，右手中指甚至需要在按2个键位的过程中进行移动，严重影响输入速度。
在速个输入过程中，左手小指需要长按SHIFT键，小指是所有手指中最没有力量的，长按非字母的远位键会对小指造成极大的压力，长期输入小指关节会变得僵硬，这已经可以上升到开发人员健康的高度了……
在小指长按SHIFT的过程中，有连续2次左手无名指的输入，原本无名指和小指就容易出现联动反映，因此在无名指不断对同一个点（S键）加力、卸力的过程中，小指会跟着无名指出现力量增强、减弱的现象，最坏情况将导致SHIFT键被松开。这种力量的突发性增强和减弱对手指关节也有着不可忽视的伤害，因此在输入KISSY这几个字符的过程中，我们左手的小指是伟大的，他顶住了千千万万的压力，最终光荣地完成了任务！
其他
jQuery通过使用别名$，将原本较为复杂的对象名变成了一个简单的字符，同时也不忘本地提供了noConflict函数用于释放$变量，这一点上想得非常周全。
Ext由于对象组织的原因，调用一个函数通常需要输入更多的路径，例好jQuery(selector)在Ext中将变成Ext.Element.query(selector)，在这一点上，Ext已经将部分常用的函数推到了Ext对象之下，如Ext.Element.fly变为Ext.fly，Ext.DomQuery.select变为Ext.query等，但就总体的代码量而言，相比jQuery是有劣势的。
KISSY兼具了Ext的模块化结构组织，同时也引入了Ext的函数访问路径过长的问题，由于Javascript中的with语句存在这样那样的问题，而使用别名代替层级较深的对象也会有这样那样的问题，因此此类问题并不容易规避。
为什么不分析YUI？因为曾经习惯Ext，后期jQuery用得多，KISSY是在笔者进入前端这个领域之后兴起的关注也较多，YUI从头到尾没有接触是笔者的一大遗憾，同时也让笔者失去了在本文中评测该框架的权利。
总结
我们将通过以下的方式给各个类库打个分
长度得分为10-长度值。
按键顺序满分为10，每出现一个问题扣去1分，出现特别严重的问题扣去2分。
最终结果见下表
名称长度 按键顺序 备注
jQuery 3 6
Ext 6 7 访问函数路径过长扣1分
KISSY 4 3 几个问题比较严重多扣4分
最后声明：笔者绝对没有黑KISSY的意思，反之对KISSY的设计、模块分隔、实现等有着深厚的兴趣，只是此文仅从顶层对象名称的输入体验上进行评测，在这一点上KISSY确实选择了一个糟糕的名字。
在此将从对象名称的长度、输入对象名称的按键顺序这两个方面对三个类库进行重点比较，同时力求照顾到一些特别的点，从而得出一个较为全面的评测结果。
名称长度
jQuery共有6个字符组成，从长度上而言是三个类库中最长的一个，同时包含了一个大写字母Q，在输入过程中需要加入一次SHIFT键，因此长度值给定为7。
Ext共有3个字符组成，在长度上是最有优势的，由于首字母为大写字母E，输入过程中需要有一次SHIFT，因此长度值给定为4。
KISSY由5个字符组成，均为大写字母，长度上而言接近jQuery，同时需要一次SHIFT键的长按，因此给定长度值6。
在名称长度的对比上，最受欢迎的jQuery以微弱的劣势惜败，但jQuery使用了其他的方式在这方面给予了改进，将在后文中提及。
按键顺序
按键顺序的分析比较复杂，这里涉及的原则主要有以下几点
尽可能地交叉使用左右手输入每一个字符。
尽可能避免同一手指连续使用。
尽可能地减少长按某个按键的时间。
食指和中指较为灵活，因此尽可能避免使用小指和无名指。
较为接近的两个手指容易出现联动的现象，即当小指移动时，无名指也会反射性进行微幅度的移动，这可能影响到下一次按键，因此尽可能避免并列的手指连动。
在评测中，将双手从左手小指至右手小指，依次编号为0-9，从数字上观察将会发现一些有趣的现象。
jQuery的按键顺序依次是606236，在输入的过程中
有一次使用了较不灵活的左手小指。
在上一条的基础上补充，事实上在按Q的时候需要用左手小指按住SHIFT键，因此Q其实是交给原本不负责Q键的左手无名指。
在输入大写Q时左手小指和无名指有连动的现象，而且不是顺序连动，而是同时敲击。
e和r由左手中指和食指连续敲击，可能出现并列的手指连动的影响。但是在实际输入过程中，笔者发现食指和中指的连动不但没有效率上的影响，反而对速度有促进作用，反思该过程，发现中指和食指连续敲击桌面是笔者在思考时经常做的动作，因此形成了一种极为高效熟练的反射运动……
Ext的按键顺序依次是213，输入过程中发现有以下问题
所有按键来自左手，右手完全空闲，无法达到理论的最高输入速度。但是由于在输入Ext的过程中，右手可以同时去定位.这个按键，因此对于整行语句的输入影响并不是很大。
输入大写的E时，左手小指需要按住SHIFT键，而紧接着输入x时，左手无名指按下的前瞬间要求小指放开SHIFT键，由于这两个手指很容易出现联动的反映，因此对左手按x键的定位精准性有着较大的影响。
KISSY的按键顺序依次是77116，这大概是几个类库中最糟糕的键位顺序了
出现右手中指、左手无名指连续按键现象，右手中指甚至需要在按2个键位的过程中进行移动，严重影响输入速度。
在速个输入过程中，左手小指需要长按SHIFT键，小指是所有手指中最没有力量的，长按非字母的远位键会对小指造成极大的压力，长期输入小指关节会变得僵硬，这已经可以上升到开发人员健康的高度了……
在小指长按SHIFT的过程中，有连续2次左手无名指的输入，原本无名指和小指就容易出现联动反映，因此在无名指不断对同一个点（S键）加力、卸力的过程中，小指会跟着无名指出现力量增强、减弱的现象，最坏情况将导致SHIFT键被松开。这种力量的突发性增强和减弱对手指关节也有着不可忽视的伤害，因此在输入KISSY这几个字符的过程中，我们左手的小指是伟大的，他顶住了千千万万的压力，最终光荣地完成了任务！
其他
jQuery通过使用别名$，将原本较为复杂的对象名变成了一个简单的字符，同时也不忘本地提供了noConflict函数用于释放$变量，这一点上想得非常周全。
Ext由于对象组织的原因，调用一个函数通常需要输入更多的路径，例好jQuery(selector)在Ext中将变成Ext.Element.query(selector)，在这一点上，Ext已经将部分常用的函数推到了Ext对象之下，如Ext.Element.fly变为Ext.fly，Ext.DomQuery.select变为Ext.query等，但就总体的代码量而言，相比jQuery是有劣势的。
KISSY兼具了Ext的模块化结构组织，同时也引入了Ext的函数访问路径过长的问题，由于Javascript中的with语句存在这样那样的问题，而使用别名代替层级较深的对象也会有这样那样的问题，因此此类问题并不容易规避。
为什么不分析YUI？因为曾经习惯Ext，后期jQuery用得多，KISSY是在笔者进入前端这个领域之后兴起的关注也较多，YUI从头到尾没有接触是笔者的一大遗憾，同时也让笔者失去了在本文中评测该框架的权利。
总结
我们将通过以下的方式给各个类库打个分
长度得分为10-长度值。
按键顺序满分为10，每出现一个问题扣去1分，出现特别严重的问题扣去2分。
最终结果见下表
名称长度 按键顺序 备注
jQuery 3 6
Ext 6 7 访问函数路径过长扣1分
KISSY 4 3 几个问题比较严重多扣4分
最后声明：笔者绝对没有黑KISSY的意思，反之对KISSY的设计、模块分隔、实现等有着深厚的兴趣，只是此文仅从顶层对象名称的输入体验上进行评测，在这一点上KISSY确实选择了一个糟糕的名字。
相关文章
下面小编就为大家带来一篇完美解决浏览器跨域的几种方法(汇总)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-05-05
这篇文章主要给大家介绍了关于javascript中event loop事件循环的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2018-12-12
这篇文章主要介绍了微信小程序用户位置权限的获取方法（拒绝后提醒）,文中给大家介绍了微信小程序获取用户当前位置的三个方式，授权方法，非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2018-11-11
这篇文章主要介绍了给事件响应函数传参数的四种方式。需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
本文主要对一个页面从输入 URL 到页面加载完的过程中都发生了什么事情进行概述，对我们学习网络语言有一定的帮助，下面就跟小编一起来看下吧2016-12-12
这篇文章主要介绍了关于ES6之"let"能替代"var"的相关资料，文中介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面跟着小编一起来学习学习吧。2017-06-06
这篇文章主要介绍了根据当前时间不同在jsp页面上显示上午或下午,需要的朋友可以参考下2014-08-08
这篇文章主要介绍了JavaScript中的数值范围介绍,本文是对JavaScript中Number类型的追根究底,读完本文将会对Number类型有一个彻底了解,需要的朋友可以参考下2014-12-12
在 JavaScript 中,内存泄露是指程序不再使用的内存没有被释放,从而导致内存的持续增长,最终可能导致性能下降或应用崩溃,本文整理了一些容易造成内存泄漏的操作以及预防方法,需要的可以了解下2024-12-12
JavaScript 中处理 null和 undefined的常见方法
文章介绍了可选链操作符（?.）和空值合并操作符（??）的使用方法,并对比了它们与逻辑非运算符（!）的区别,还讨论了使用宽松比较运算符（==）和自定义函数来优化判断的几种方法,以提高代码的可读性和性能,感兴趣的朋友跟随小编一起看看吧2025-01-01
最新评论