接口

在JavaScrip中模仿接口

用注释描述接口

/*

interface Composite {
    function add(child);
    function remove(child);
    function getChild(index);
}

interface FormItem {
    function save();
}

*/

var Composite = function(id, method, action) { // implements Composite, FormItem
};

Composite.prototype.add = function(child) {
    console.log("add");
}

Composite.prototype.remove = function(child) {
    console.log("remove");
}

Composite.prototype.getChild = function(index) {
    console.log("getChild");
}

Composite.prototype.save = function() {
    console.log("save");
};

var instance = new Composite(1, 2, 3);
instance.add();
instance.remove();
instance.getChild();
instance.save();

用属性检查模仿接口

概括:

  • 一个方法用于表明自己实现了哪些接口。
  • 一个方法用于验证是否实现了所有的接口,如果没有,则抛出异常。
  • 一个方法用于判断某个类是否实现了所有的接口。

缺点:

  • 自己说自己实现了什么接口,但是可能自己并没有实现,但是代码却不会抛出异常。
  • 用了两层for循环,会引起性能消耗。
/*

interface Composite {
    function add(child);
    function remove(child);
    function getChild(index);
}

interface FormItem {
    function save();
}

*/

var CompositeForm = function(id, method, action) {
    this.implementsInterface = ['Composite', 'FormItem'];
    // ...
} 

function addForm(instance) {
    if(!implements(instance, 'Composite', 'FormItem')) {
        throw new Error('Object does not implement a required interface');
    }

    if(!implements(instance, 'test', 'FormItem')) {
        throw new Error('Object does not implement a required interface');
    }
}   

function implements(object) {
    for(var i = 1;i < arguments.length;i++) {

        var interfaceName = arguments[i];
        var interfaceFound = false;
        for(var j = 0;j < object.implementsInterface.length;j++) {
            if(object.implementsInterface[j] == interfaceName) {
                interfaceFound = true;
                break;
            }
        }
        if(!interfaceFound) {
            return false;
        }
    }
    return true;
} 

var instance = new CompositeForm(1, 2, 3);
addForm(instance);

用鸭式辨型模仿接口

  • 类是否声明自己支持哪些接口并不重要, 只要具有这些接口中的方法就可以了。
  • 它把对象实现的方法集作为判断它是不是某个类的实例的唯一标准。
  • 也就是说,如果对象具有与接口定义的方法同名的所有方法,那么就可以认为它实现了这个接口。
// Interface.js文件

/*
 * 一个接口
 * @param {string} name 接口的名字
 * @param {array} methods 接口要实现的方法
 * @class
 */
var Interface = function(name, methods) {
    if(arguments.length !== 2) {
        throw new Error("Interface constructor called with " + arguments.length
            + "arguments, but expectly exactly 2.");
    }

    this.name = name;
    this.methods = [];

    for(var i = 1;i < methods.length;i++) {
        if(typeof methods[i] !== "string") {
            throw new Error("Interface constructor expects method names to be "
                + "passed in as a string");
        }
        this.methods.push(methods[i]);
    }
};

/*
 * static class method 用于实现检测对象是否实现了接口里的所有方法
 *
 * @param {object} object 它应该包含一个对象的实例和至少一个接口
 *
 */

Interface.prototype.ensureImplements = function(object) {
    if(arguments.length < 2) {
        throw new Error("Function Interface.ensureImplements called with " + arguments.length
            + "arguments, but expectly at least 2.");
    }

    for(var i = 1;i < arguments.length;i++) {
        var interface = arguments[i];

        if(interface.constructor !== Interface) {
            throw new Error("Function interface.ensureImplements expects arguments "
                + "two and above to be instances of Interface.");
        }

        for(var j = 0, methodsLen = interface.methods.length;j < methodsLen;j++) {
            var method = interface.methods[j];
            if(!object[method] || typeof object[method] !== 'function') {
                throw new Error("Function Interface.ensureImplements: Object "
                    + "does not implement the " + interface.name
                    + " interface.Method " + method + " was not found");
            }
        }
    }
}

// index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <script src="Interface.js"></script>
    <script type="text/javascript">

        // 实例化一个接口
        var PeopleInterface = new Interface('PeopleInterface', ['run', 'eat']);

        // 封装一个People类
        var People = function(name) {
            this.name = name;
        };

        People.prototype.run = function() {
            console.log(this.name + " is running...");
        };

        People.prototype.eat = function() {
            console.log(this.name + " is eating...");
        };

        // 实例化一个People对象
        var yzf = new People('yzf');

        function addPeople(instance) {

            // 对yzf进行检测,看它是否完全继承了PeopleInterface接口
            PeopleInterface.ensureImplements(yzf, PeopleInterface);

            // 如果没有抛出异常,就可以使用下面这些方法了
            yzf.run();
            yzf.eat();
        }

        addPeople(yzf);
    </script>
</body>
</html>

依赖于接口的设计模式

工厂模式

组合模式

装饰者模式

命令模式

JavaScript设计模式读书笔记之一:接口的更多相关文章

  1. JavaScript设计模式:读书笔记(未完)

    该篇随我读书的进度持续更新阅读书目:<JavaScript设计模式> 2016/3/30 2016/3/31 2016/4/8 2016/3/30: 模式是一种可复用的解决方案,可用于解决 ...

  2. JavaScript设计模式 -- 读书笔记

    JavaScript设计模式 一. 设计模式 一个模式就是一个可重用的方案: 有效的解决方法.易重用.善于表达该解决方案: 未通过"模式特性"测试的模式称为模式原型: 三规则:适用 ...

  3. 《你不知道的javascript》读书笔记2

    概述 放假读完了<你不知道的javascript>上篇,学到了很多东西,记录下来,供以后开发时参考,相信对其他人也有用. 这篇笔记是这本书的下半部分,上半部分请见<你不知道的java ...

  4. HeadFirst设计模式读书笔记--目录

    HeadFirst设计模式读书笔记(1)-策略模式(Strategy Pattern) HeadFirst设计模式读书笔记(2)-观察者模式(Observer Pattern) HeadFirst设计 ...

  5. 《编写可维护的javascript》读书笔记(中)——编程实践

    上篇读书笔记系列之:<编写可维护的javascript>读书笔记(上) 上篇说的是编程风格,记录的都是最重要的点,不讲废话,写的比较简洁,而本篇将加入一些实例,因为那样比较容易说明问题. ...

  6. JavaScript设计模式学习笔记

    1 JavaScript设计模式深入分析 私有属性和方法:函数有作用域,在函数内用var 关键字声明的变量在外部无法访问,私有属性和方法本质就是你希望在对象外部无法访问的变量. 特权属性和方法:创建属 ...

  7. Javascript & JQuery读书笔记

    Hi All, 分享一下我学JS & JQuery的读书笔记: JS的3个不足:复杂的文档对象模型(DOM),不一致的浏览器的实现和便捷的开发,调试工具的缺乏. Jquery的选择器 a. 基 ...

  8. Head First 设计模式读书笔记(1)-策略模式

    一.策略模式的定义 策略模式定义了算法族,分别封装起来,让它们之间可以互换替换,此模式让算法的变化独立使用算法的客户. 二.使用策略模式的一个例子 2.1引出问题 某公司做了一套模拟鸭子的游戏:该游戏 ...

  9. JavaScript设计模式系列学习笔记目录

    说明 本系列笔记参考书籍<JavaScript设计模式>.<JavaScript高级程序设计3> 参考博客:汤姆大叔博客:http://www.cnblogs.com/TomX ...

随机推荐

  1. 锋利的jQuery中的事件与动画

    奋夜的奋斗  ----  事件与动画 ----  来自地狱的战镰 小小的单词难不倒我们哦!!!!!!!    bind:绑定     unbind:接触绑定    toggle:栓牢   fadeou ...

  2. Linux tomcat设置ip地址直接访问,tomcat设置ip地址直接访问,tomcat绑定ip地址

    Linux tomcat设置ip地址直接访问,tomcat设置ip地址直接访问,tomcat绑定ip地址 >>>>>>>>>>>> ...

  3. Cocos2dx热更新遇到的那些坑

    1.Cocos2dx热更新因为文件名含有空格,ios下载失败bug修改 问题描述: 项目中偶尔遇到美术图片命名时不规范,导致图片名字含有空格.导致ios热更新时,遇到下载失败. 解决方案: 1.从新改 ...

  4. 【2017-03-05】函数基础、函数四种结构、ref和out参数、递归

    一.函数基础 1.函数/方法:非常抽象独立完成某项功能的一个个体 2.函数的作用: 提高代码的重用性提高功能开发的效率提高程序代码的可维护性 3.分类 固定功能函数高度抽象函数 4.函数四要素:输入, ...

  5. js相关小实例——div实现下拉菜单

    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  6. 2017-03-10 T-sql 语句 高级查询

    T-SQL语句: 创建数据库: 1,点击新建查询,在弹出的页面上进行代码编写.点击可用数据库,编写前确定当前操作的页面是自己想要进行操作的界面. 2,数据库创建语句 Create datebase   ...

  7. [设计模式] Iterator - 迭代器模式:由一份奥利奥早餐联想到的设计模式

    Iterator - 迭代器模式 目录 前言 回顾 UML 类图 代码分析 抽象的 UML 类图 思考 前言 这是一包奥利奥(数组),里面藏了很多块奥利奥饼干(数组中的元素),我将它们放在一个碟子上慢 ...

  8. 《C++之那些年踩过的坑(二)》

    C++之那些年踩过的坑(二) 作者:刘俊延(Alinshans) 本系列文章针对我在写C++代码的过程中,尤其是做自己的项目时,踩过的各种坑.以此作为给自己的警惕. 今天讲一个小点,虽然小,但如果没有 ...

  9. Levenshtein distance 编辑距离

    编辑距离,又称Levenshtein距离,是指两个字串之间,由一个转成另一个所需的最少编辑操作次数.许可的编辑操作包括将一个字符替换成另一个字符,插入一个字符,删除一个字符 实现方案: 1. 找出最长 ...

  10. gzip 与 gunzip 语法与示例

    gzip 与 gunzip 语法与示例 语法: gunzip -c 被压缩的文件 > 已解压的文件示例: 将 catalina.out.gz 文件解压到 catalina.out 文件中: gu ...