没有合适的资源?快使用搜索试试~ 我知道了~
资源推荐
资源详情
资源评论
深入浅析深入浅析JavaScript的的API设计原则设计原则
主要介绍了JavaScript的API设计原则,包括接口的流畅性,一致性,参数的处理,可扩展性,对错误的处理,
可预见性,注释和文档的可读性,本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起学习吧
一、接口的流畅性一、接口的流畅性
好的接口是流畅易懂的,他主要体现如下几个方面:
1.简单简单
操作某个元素的css属性,下面是原生的方法:
document.querySelectorAll('#id').style.color = 'red';
封装之后
function a(selector, color) {
document.querySelectorAll(selector)[].style.color = color
}
a('#a', 'red');
从几十个字母长长的一行到简简单单的一个函数调用,体现了api简单易用
2.可阅读性可阅读性
a('#a', 'red')是个好函数,帮助我们简单实用地改变某个元素,但问题来了,如果第一次使用改函数的人来说会比较困惑,a函
数是啥函数,没有人告诉他。开发接口有必要知道一点,人都是懒惰的,从颜色赋值这个函数来说,虽然少写了代码,但是增
加了记忆成本。每次做这件事情的时候都需要有映射关系。 a---->color. 如果是简单的几个无所谓,但是通常一套框架都有几
十甚至上百的api,映射成本增加会使得程序员哥哥崩溃。 我们需要的就是使得接口有意义,下面我们改写一下a函数:
function letSomeElementChangeColor(selector, color) {
document.querySelectorAll(selector, color);
}
letSomeElementChangeColor相对于a来说被赋予了语言意义,任何人都会知道它的意义
3.减少记忆成本减少记忆成本
我们刚刚的函数也是这样的它太长了letSomeElementChangeColor虽然减少了映射成本,但是增加了记忆成本。要知道,包
括学霸在内,任何人都不喜欢被单词。原生获取dom的api也同样有这个问题 document.getElementsByClassName;
document.getElementsByName; document.querySelectorAll;这些api给人的感觉就是单词太长了,虽然他给出的意义是很清
晰,然而这种做法是建立在牺牲简易性的基础上进行的。于是我们又再次改写这个之前函数
function setColor(selector, color) {
xxxxxxxxxxxx
}
在意义不做大的变化前提下,缩减函数名称。使得它易读易记易用;
4.可延伸可延伸
所谓延伸就是指函数的使用像流水一样按照书写的顺序执行形成执行链条:
document.getElementById('id').style.color = 'red';
document.getElementById('id').style.fontSize = 'px';
document.getElementById('id').style.backgourdColor = 'pink';
用我们之前的之前的方法是再次封装两个函数 setFontSize, setbackgroundColor; 然后执行它们 setColor('id',
'red');setFontSiez('id', '12px'); setbackgroundColor('id', 'pink'); 显然,这样的做法没有懒出境界来;id元素每次都需要重新获
取,影响性能,失败;每次都需要添加新的方法 失败 每次还要调用这些方法,还是失败。下面我们将其改写为可以延伸的函
数 首先将获取id方法封装成对象,然后再对象的每个方法中返回这个对象:
function getElement(selector) {
this.style = document.querySelecotrAll(selector).style;
}
getElement.prototype.color = function(color) {
this.style.color = color;
return this;
}
getElement.prototype.background = function(bg) {
this.style.backgroundColor = color;
return this;
}
资源评论
weixin_38558623
- 粉丝: 4
- 资源: 930
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 基于activiti6和jeesite4的dreamFlow工作流管理设计源码
- 基于Python实现的简单植物大战僵尸脚本设计源码
- 基于Java及Web技术的医药管理系统设计源码
- 基于Objective-C的cordova-plugin-wechat插件开发源码研究
- 基于Python语言的SocialNetworkBackend社交数据分析系统后端设计源码
- 基于Python的pytracking-master目标跟踪dimp方法设计源码
- 基于PHP、JavaScript、CSS的zibll主题美化插件设计源码
- 毕业设计之mimo系统中中最大比合并和空时编码的性能研究
- 本程序对基于matlab对NOMA系统中经典多用户功率分配算法进行了研究
- Phone-1.zip
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功