Javascript实现模仿接口的3种方式

更新日期: 2017-12-22阅读量: 1527标签: js知识

1.注释法:

此方法属于程序文档范畴,对接口的继承实现完全依靠程序员自觉 

/*
   interface People{
         function createHead();
         function createBody();
   }
*/
var woman = function(name){   //implements People interface
    this.name = name;
}
woman.prototype.showName = function(){
    alert(this.name);
}
woman.prototype.createBody = function(){  //实现必要的方法
    alert("身体已经创建好");
}
woman.prototype.createHead = function(){
    alert("头部已经创建好");
}


2.属性检查法:

把要实现的接口方法添加到类属性列表里,通过定义好的检测反复检查是否已经实现了那些方法
//优缺点:可以强迫程序员实现接口,没实现就报错。不过虽然声明了自己实现了哪些方法,但实现时很可能有遗漏  

/*
interface People{
    function createHead();
    function createBody();
}
*/
var woman = function(name){
    this.name = name;
    this.implementsInterfaces = ['People'];
}
woman.prototype.showName = function(){
    alert(this.name);
}
woman.prototype.createBody = function(){  //实现必要的方法
    alert("身体已经创建好");
}
woman.prototype.createHead = function(){
    alert("头部已经创建好");
}

function implement(obj,interfaces){
    for(var i=1;i<interfaces.length;i++){
        var interfaceName = interfaces[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;
}

function  isImplememts(instance,interfaces){    //判断对象是否已经继承相应接口
    if(!implement(instance,interfaces)){
        throw new Error("Object doesn't implement a required interface");
    }
}


3.鸭式辨型法:

(不通过外表判断鸭子,而通过其是否有鸭子的特性来判断。如James Whitcomb Riley所说,像鸭子一样走路并且嘎嘎叫的就是鸭子)
上面俩种都声明了自己实现了那些接口,其实声明不重要,实现接口核心的是类实现了接口方法集。如果类具有了接口定义的所有方法函数名相同的函数,那么认为它实现了接口  

//接口类,用来创建接口
var Interface = function(name,motheds){
    if(agruments.length!=2){
        throw new Error("Interface constructor called with "+arguments.length+"arguments,but expected exactly 2");
    }
    this.name = name;
    this.methods = [];
    for(var i=0;i<motheds.length;i++){
        if(typeof motheds[i] !== 'string'){
            throw new Error('Interface constructor expects mothed names to be'+'passes in as a string');
        }
        this.methods.push(motheds[i]);
    }
}
Interface.prototype.ensureImplements = function(objs){
    if(agruments.length != 1){
        throw new Error("Interface constructor called with "+arguments.length+"arguments,but expected exactly 1")
    }
    for(var i=0;i<objs.length;i++){
         var obj = objs[i];
         for(var j=0;j<this.motheds.length;j++){
               var mothed = this.methods[j];
               if(!obj[mothed] || !typeof obj[mothed] !== 'function'){
                    throw new Error('Function Interface.ensureImplements:implements interface'+this.name+',obj.mothed'+mothed+'was not found');
               }
         }
    }
}
//创建接口
var People = new Interface('People',['createHead','createBody']);
//子类
var Woman = function(name){
    this.name = name;
    this.implementsInterfaces = ['People'];
}
Woman.prototype.showName = function(){
    alert(this.name);
}
Woman.prototype.createBody = function(){  //实现必要的方法
    alert("女人身体已经创建好");
}
Woman.prototype.createHead = function(){
    alert("女人头部已经创建好");
}
//子类
var Man = function(name){
    this.name = name;
    this.implementsInterfaces = ['People'];
}
Man.prototype.showName = function(){
    alert(this.name);
}
Man.prototype.createBody = function(){  //实现必要的方法
    alert("男人身体已经创建好");
}
Man.prototype.createHead = function(){
    alert("男人头部已经创建好");
}
//判断是否实现
Poeple.ensureImplements(['Woman','Man']);


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: https://www.fly63.com/article/detial/274

JavaScript中奇特的~运算符

本次分享一下并不是很常用的按位非运算符~的原理以及一点点用法。产生式 UnaryExpression : ~ UnaryExpression 按照下面的过程执行:令 expr 为解释执行 UnaryExpression 的结果。令 oldValue 为 ToInt32(GetValue(expr))。返回 oldValue 按位取反的结果。

JavaScript中变量提升和函数提升的意义理解

在ES6之前,Js中是没有块级作用域的,只存在全局作用域和函数作用域。变量提升即将变量声明提升到它所在作用域的最开始的部分;函数提升只有函数声明中才发生。

Js输出方式有哪些?

在编写JavaScript代码的时候, 一定要记住每一句代码后面都需要添加一个分号, 并且这个分号必须是英文的分号,我们会发现有时候不写分号程序也能够运行, 这里并不是因为不需要分号, 而是浏览器自动帮助我们添加了分号

js中async与defer

async 异步加载,立即下载,不应妨碍页面其他操作,标记为 async 的异步脚本并不保证按照指定的先后顺序执行,用async很容易出错,async 是无序执行,自身加载完就会执行;

js设备判断_判断移动端还是PC端?判断android还是ios?判断移动端浏览器类型?

js判断用户的浏览设备是移动设备还是PC?判断详细浏览器设备信息。判断微信、新浪、QQ打开。判断是android系统还是ios系统...

Js实现点击查看全文(类似今日头条、知乎日报效果)

这篇文章主要为大家详细介绍了原生JS+css仿QQ今日头条、知乎日报点击查看全文的效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下.

浅谈js自记忆函数

最近阅读《JavaScript忍者秘籍》看到了一种有趣的函数:自记忆函数。记忆化(memoization)是一种构建函数的处理过程,能够记住上次计算结果,当函数计算得到结果时,就将该结果按照参数存储起来。

JS方法整理_js常用函数大全

都是日常工作中使用的一些js方法,整理出来以便大家学习使用。主要包括:Js获取页面地址参数 、千分位 、判断是否数字 、图片按比例压缩、截取指定字节数的字符串、判断是否微信 、获取时间格式的几个举例 、获取字符串字节长度 、对象克隆、深拷贝 ...

js判断是否为IE浏览器的多种方法总汇

这篇文章主要整理通过js来判断浏览器是否为IE的多种方法。使用js脚本判断浏览器是否为ie,这里分享六种判断是否为ie的方法,有需要的朋友参考学习下。

用js打印hello world,JavaScript中你不知道的实现方式

如何使用js很装X的打印“hello world”,代码长短不重要,下面就整理一些实现方式。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!