面向对象在JavaScript中的接口实现
接口是面向对象编程的基础。它是一组包括了函数型方法的数据结构,与类一样。都是编程语言中比較抽象的概念。比方生活中的接口。机顶盒。人们利用它来实现收看不同频道和信号的节目,它宛如对不同类型的信息进行集合和封装的设备。最后把各种不同类型的信息转换为电视可以识别的信息。在编程语言中的接口,实际上是不同类的封装并提供统一的外部联系通道,这样其它对象就行利用接口来调用不同类的成员了。
——整理自《jQuery开发从入门到精通》
接口的概念
API接口(应用程序接口)、人机交互接口、电源接口、USB接口等尽管用途不同,功能各异。可是都包括一个共同的特性:约定、规范。
能够说,接口就是一张契约和合同,它约定了设计者和使用者都必须遵循的要求。
- interface Base{
- void function1();
- void function2();
- void function3();
- }
Base接口承诺了3个基本功能:function1()、function2()、function3()。
这个接口就像是一份合同。在甲方(调用类的用户)和乙方(定义类的开发者)之间约定。
- class App implements Base // 定义一个App类,用这个类来实现接口Base
专业来说就是。应用类App继承Base接口类。
- class App implements Base{
- void function1(){
- System.out.println("I am fun1");
- }
- void function2(){
- System.out.println("I am fun2");
- }
- void function3(){
- System.out.println("I am fun3");
- }
- }
这样。乙方实现了这个接口,而甲方也应该来依照接口的约定去使用类App即可了。
可是对于JavaScript弱类型语言来说,严格的类型检查会束缚JavaScript的灵活性。非常多前端开发者根本不用接口,但不会影响脚本的设计。
项目越大。这样的开销越大。
所以,用不用接口能够遵循两个条件:
假设是简单的应用,就不必使用接口了。
防止它被频繁运行。影响性能。
接口的实现
在输入前分别检測每一个參数类型是否符合规定。
同一时候检查參数是否存在残缺,并即时以0补齐參数。
- function Interface(name,methods){ // 接口辅助类,參数包含接口实例的名称和方法集
- if(arguments.length!=2){ // 假设參数个数不等于2,抛出异常。
- throw new Error('标准接口约定。须要两个參数');
- }
- this.name = name; // 存储第一个參数值,实例化后就是接口实例的名称
- this.methods = []; // 接口实例的方法存储器
- if(methods.length < 1){ // 假设第二个參数的元素个数为0,说明是空数组。抛出异常。
- throw new Error('接口的第二个參数不能为空');
- }
- for(var i = 0; i < methods.length; i++){ // 開始对第2个參数的元素进行遍历检測
- var item = methods[i];
- if(typeof item[0] !== 'string') { // 假设第二个參数的第一个元素不是string类型,抛出异常
- throw new Error("接口约定的第一个參数应为字符串");
- }
- if(item[1]&&typeof item[1] !== 'number'){ // 假设第二个參数有第二个元素,且第二个元素不是number类型,抛出异常
- throw new Error('接口约定的第个參数应为数值');
- }
- if(item.length == 1){ // 假设第二个參数仅仅有一个元素。那么手动给它加入第二个元素 0
- item[1] = 0;
- }
- this.methods.push(item); // 把符合规定的方法存储到数组存储器中。
- }
- }
(2) 为接口辅助类 Interface 定义一个方法 implements,该方法将检測实现类是否符合接口实例的约定。
它至少包含两个參数,第1个參数o表示实现类。第2个參数及其后面的參数表示该类将要实现的接口标准。也就是说,能够为一个类指定多个接口约定,这样就能够更灵活的分类设计接口实例。然后遍历第二个及其后面的全部參数,在循环结构中,先洁厕接口是否为接口标准的实例,否则就会抛出异常。
再从接口实例的方法存储器中逐一读取方法名,填入类中来验证类的方法是否符合接口实例设置的标准,验证包含方法名、function类型和參数个数。假设有问题,马上抛出异常。
- Interface.implements = function(o){ // 用于检測类方法是否符合接口实例的约定 。此处的o,将来会是类中的this
- if(arguments.length<2){ // 检測该方法传递的数值是否符合规定
- throw new Error("接口约定类应包括至少两个參数。");
- }
- for(var i=1;i<arguments.length; i++){ // 遍历检測类所遵循的实例是否合法
- var interface = arguments[i]; // 这里interface表示接口的实例对象。
- if(interface.constructor !== Interface){
- throw new Error('从第2个以上的參数必须为接口实例');
- }
- for(var j=0;j<interface.methods.length;j++){ // 检測类方法是否符合接口实例的约定
- var method = interface.methods[j][0];
- if(!o[method] || typeof o[method] !== 'function' || o[method].length!==interface.methods[j][1]) {
- throw new Error("该实现类没能履行" + interface.name + "接口方法" + method + "约定");
- }
- }
- }
- }
(3) 实例化接口标准,Interface 接口不过个构造函数,也就是个框架协议,还没有制定类应该遵循的详细标准。框架协议中。已经设计好了监測逻辑,一旦实例化接口。并指明类应遵守的约定,那么应用该标准的实例的类就必须准守。
- // 设置接口的不同实现实例
- var Get = new Interface("Get",[["get",0]]);
- var Set = new Interface("Set",[["set",1]]);
- var Saying = new Interface("Saying",[["saying",1]]);
- var Base = new Interface("Base",[["get",0],["set",1]]);
- var Base1 = new Interface("Base1",[["set",1],["get",0]]);
- var Base2 = new Interface("Base2",[["get",0],["set",1],["saying",1]]);
(4) 在类中定义应该实现的标准,即类应该遵循的接口约定。
- // 创建一个木驴类
- function Neddy(){
- this.name = '';
- Interface.implements(this,Base,Get,Set); // 让木驴类实现接口的实例,能够指定多个。也能够仅仅有一个。
- }
- // 依照接口实例来定义 两个方法get,set
- Neddy.prototype.get = function(){
- return this.name;
- }
- Neddy.prototype.set = function(name){
- this.name = name;
- }
(5) 在类中设置了多个接口实例。我们来进行检測
- // 检測接口实现
- var neddy = new Neddy();
- neddy.set("Testing");
- console.log(neddy.get()); // Testing
成功完毕接口的应用,这里,假设在Neddy类中,我们让它实现的接口实例和 Neddy.prototype中给类定义的方法不统一,或者接口与接口之间有冲突,就会抛出异常。比方我们能够改动Neddy中的接口实现。再给它加入一个接口实例Base2,就会报异常。由于我们没有依照接口的协议,给Neddy加入saying()方法。

① arguments.callee.length
② 函数名.length
③ arguments.length
当中 ① 和 ② 是一样的,③ 视详细情况而定。
一般函数声明式的定义有个默认属性name继承自Object ,举比例如以下:
- function fn(x,y){
- console.log(fn.name); // fn
- console.log(arguments.callee.name); // fn
- console.log(fn.length); // 2
- console.log(arguments.callee.length); // 2
- console.log(arguments.length); // 视详细情况而定
- }
- fn(1,2,3); // 分别输出 fn fn 2 2 3
为了说明上面接口检測參数长度 o[method].length 的问题 ,举比例如以下:
- function A(){}
- A.prototype.say = function (x,y,z,o) {}
- var a = new A();
- console.log(a['say'].length); // 4
面向对象在JavaScript中的接口实现的更多相关文章
- 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型
前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...
- 前端开发:面向对象与javascript中的面向对象实现(一)
前端开发:面向对象与javascript中的面向对象实现(一) 前言: 人生在世,这找不到对象是万万不行的.咱们生活中,找不到对象要挨骂,代码里也一样.朋友问我说:“嘿,在干嘛呢......”,我:“ ...
- 【总结】浅谈JavaScript中的接口
一.什么是接口 接口是面向对象JavaScript程序员的工具箱中最有用的工具之一.在设计模式中提出的可重用的面向对象设计的原则之一就是“针对接口编程而不是实现编程”,即我们所说的面向接口编程,这个概 ...
- javascript中天气接口案例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 前端开发:javascript中的面向对象
前端开发:面向对象与javascript中的面向对象实现(一) 面向对象理解: 面向对象是一种对现实世界理解和抽象的方法,是一种先进的程序设计理念,是一种比较抽象的,多形态的设计模式.我们可以这么理解 ...
- 如何理解并学习javascript中的面向对象(OOP) [转]
如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的作者一样,写出属于自己优秀的类库(哪怕是基于 jquery的插件).那么,你请务必要学习javascript ...
- 『JavaScript』模仿接口
JavaScript中并没有内置的创建或实现接口的方法.这里将利用JavaScript的灵活性,来实现与接口意义相同的功能. 什么是接口? 接口的好处: 接口提供了一种用以说明一个对象应该具有哪些方法 ...
- typescript中的接口
说到接口:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用.接口定义了某一批类所需要遵守的规范,接口不关心这些类的内部状态数据,也不关心 ...
- JAVAFX 2.0 javascript中调用java代码
现在你已经知道如何在JavaFX中调用JavaScript.在本章中,你将了解到相反的功能——在web页面中调用JavaFX. 大体上的理念是在JavaFX程序中创建一个接口对象,并通过调用JSObj ...
随机推荐
- [POJ1160] Post Office [四边形不等式dp]
题面: 传送门 思路: dp方程实际上很好想 设$dp\left[i\right]\left[j\right]$表示前$j$个镇子设立$i$个邮局的最小花费 然后状态转移: $dp\left[i\ri ...
- 一两眼题(oneortwo)
一两眼题(oneortwo) 题目描述 给出n个整数,依次为a1,a2,...an.n<=50000. 你要进行K次操作,0 <= k < =1,414,213,562 每次操作你算 ...
- 关于微信小程序并发数不能超过五个的问题
wx.request 的最大请求数为5个,超过的部分就请求不到了 昨天遇到个问题,首页的请求数一共有9个,但是在有appid开发时竟然一直都没出错,直到我切到没appid的版本的时候才发现了这个问题. ...
- 所驼门王的宝藏(bzoj 1924)
Description Input 第一行给出三个正整数 N, R, C. 以下 N 行,每行给出一扇传送门的信息,包含三个正整数xi, yi, Ti,表示该传送门设在位于第 xi行第yi列的藏宝宫室 ...
- URL短网址生成算法原理和php实现案例
短网址(Short URL),顾名思义就是在形式上比较短的网址. 短链接的好处:1.内容需要:2.用户友好:3.便于管理为什么要这样做的,原因我想有这样几点:微博限制字数为140字一条,那么如果我们需 ...
- BZOJ 3509: [CodeChef] COUNTARI
3509: [CodeChef] COUNTARI Time Limit: 40 Sec Memory Limit: 128 MBSubmit: 883 Solved: 250[Submit][S ...
- jquery取得iframe中元素的方法
原文发布时间为:2010-12-27 -- 来源于本人的百度文章 [由搬家工具导入] 收集利用Jquery取得iframe中元素的几种方法 :contents() $.trim($("if ...
- 阿里巴巴Java开发手册公开版(转)
1.不要嫌名字长 无论是方法,变量,还是函数的取名,不要嫌弃名称太长,只要能够表示清楚含义就可以了. 2.String[] args而不是String args[] 中括号是数组类型的一部分,数组定义 ...
- Javascript中函数声明与函数表达式的不同
定义函数的方式有两种:一种是函数声明,另一种是函数表达式. 函数声明的语法如下: function functionName(arg0,arg1,arg2){ //函数体 } 函数表达式的语法如下: ...
- ubuntu 12.04LTS下搭建Andriod开发环境记录
今天在Ubuntu 12.04 LTS 下安装了android开发环境. 1, 安装JDK 先去 Oracle下载Linux下的JDK压缩包,我下载的是jdk-7u4-linux-i586.tar.g ...