本文实例讲述了JavaScript 接口原理与用法。分享给大家供大家参考,具体如下:
js接口
意义:
提供一种以说明一个对象应该有哪些方法的手段。
接口是面向对象javascript程序员的工具箱中最有用的工具之一
接口的利弊:
-
对于一些中小型程序来说 使用接口很显然是不明智的,对项目来说接口的好处也不明显,只是徒增其复杂度而已。
-
对于接口的好处,那么显而易见 首先促进代码的重用,对于开发来讲,还可以告诉程序员那些类都使用了什么方法,如果你事先知道接口那么就减少了你在编码的时候对类与类之间冲突,实现解耦。对于测试和调试也会变得轻松,用于javascript的弱类型语言,类型不匹配经常出现,那么使用接口,这一点会变得容易一些。
注释接口描述
优点:程序员可以有一个参考
缺点:属于文档的范畴 ,这种方式过于松散, 没有检查接口的方法是否完全被实现
interface Composite{ function add (obj) ; function remove (obj) ; function update ( obj ) ; } //CompositeImp1 implements Composite var CompositeImp1 = function () { } CompositeImp1.prototype.remove = function ( obj ) { } CompositeImp1.prototype.update = function ( obj ) { } CompositeImp1.prototype.add = function (obj) { } var c1 = new CompositeImp1();
属性检测
判断接口是否存在
/*interface Composite{ function add (obj) ; function remove (obj) ; function update ( obj ) ; } interface FormItem { function select (obj) ; } */ //CompositeImp1 implements Composite , FormItem var CompositeImpl = function () { //显式在类的内部, 接受所实现的接口 //一般来说, 在类的内部,定义一个数组(数组变量名字固定) this.implementsInterfaces = ['Composite', 'FormItem']; //利用 implementsInterfaces 后续的判断使用 } CompositeImpl.prototype.remove = function ( obj ) { // do something ... } CompositeImpl.prototype.update = function ( obj ) { } CompositeImpl.prototype.add = function (obj) { alert('add'); } CompositeImpl.prototype.select = function (obj) { } //检测 CompositeImpl 类 的对象 function CheckCompositeImpl ( instance ) {//实例对象作为参数,检测是否存在 //判断当前对象是否实现了所有的接口。 if ( !IsImplements(instance,'Composite','FormItem') ) { throw new Error('Object does not implement a requried interface'); } } //公用的具体的检测方法(核心方法) //return boolean function IsImplements ( obj ) { //判断实例对象,有没有实现相关的接口. //arguments 对象 获得函数的实际参数 for ( var i=1; i<arguments.length; i++ ) { //接收所实现接口的名字 var interfaceName = arguments[i]; //判断此方法, 是 成功,还是失败。 var interfaceFound = false; for ( var j=0; j<obj.implementsInterfaces.length; j++ ) { if ( obj.implementsInterfaces[j] == interfaceName ) { interfaceFound = true; break; } } if ( !interfaceFound ) { return false; } } return true; }
鸭式辩型法
核心: 一个类实现接口的主要目的:把接口里的方法都实现。(检测实现方法)
完全面向对象,代码实现统一, 也解耦
//1 ,接口类。 //定义一个类,作为借口的基类,通过类实例化N多个接口实例。// Class Interface 接口类所需要的2个参数 参数1:接口的名字 (string) 参数2:接收方法名称的集合 methods, 是一个数组 (array) //实现抽象方法 var Interface=function( name,methods ){ //methods 的名字必须是String类型的可以. if( arguments.length != 2 ){ throw new Error('the instance Interface constructor arguments must be 2 length!'); }; this.name=name; this.methods=[]; //定义一个内置的空数组对象,等待接受methods里的元素 (方法名字); for( var i=0; i<methods.length; ++i ){ if( typeof methods[i] !== 'string' ){ throw new Error('ths Interface method name is error'); }; this.methods.push( methods[i] ); }; }; //2 准备工作: 具体的实现类 //①实例化接口对象. var CompositeInterface=new Interface('CompositeInteface',['add','remove']); var FormIntemInterface=new Interface('FormIntemInterface',['update','select']); //CompositeImpl implements CompositeInterface,FormIntemInterface. //②具体的实现类 var CompositeImpl=function(){ } //③实现接口的方法 //implements methods CompositeImpl.prototype.add=function(){ alert('add'); } CompositeImpl.prototype.remove=function(){ alert('remove'); } CompositeImpl.prototype.update=function(){} // CompositeImpl.prototype.select=function(){} //3: 检验接口里的方法. //检验通过, 不做任何操作, 代码继续执行. 不通过,抛出异常, Error. //这个方法的目的,就是检测方法的 . Interface.ensureImplements=function( obj ){ //核心检验方法. if( arguments.length < 2 ){ //如果检测的方法接受的参数小于2个, 参数传递失败. throw new Error('Interface.ensureImplements method constructor arguments must be >= 2!'); }; //获得接口实例对象,通过接口实例对象, 得到接口实例对象里的方法. for( var i=1; i<arguments.length; ++i ){ var instanceInterface=arguments[i]; //判断参数 是否是接口类的 类型. 是否是 接口类的构造函数. if( instanceInterface.constructor != Interface ){ throw new Error('the arguments constructor not be Interface Class'); }; //循环接口实例对象的每一个方法 . for( var j=0; j<instanceInterface.methods.length; ++j ){ //用一个临时变量接收每一个方法的名字,注意是字符,并不是函数. var methodName=instanceInterface.methods[j]; //object[key]; if( !obj[methodName] || typeof obj[methodName] !== 'function' ){ //对象没有这个方法. throw new Error('the method name "' + methodName + '" is not found!'); }; }; } } var c1=new CompositeImpl(); Interface.ensureImplements( c1,CompositeInterface,FormIntemInterface ); c1.add();
总结:接口是实现解耦。避免类和类之间,调用方法的冲突。
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
华山资源网 Design By www.eoogi.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
华山资源网 Design By www.eoogi.com
暂无评论...
更新日志
2024年12月23日
2024年12月23日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]