第一章

创建一个类

方法一：
     var Anim = function() {
          ...
     };
     Anim.prototype.start = function() {
          ...
     };
     Anim.prototype.stop = function() {
          ...
     };
方法二：
     var Anim = function() {
          ...
     };
     Anim.prototype = {
          start: function() {
               ...
          },
          stop: function() {
               ...
          }
     };
方法三：
     Function.prototype.method =  function(name, fn) {
          this.prototype[name] = fn;
     };
     var Anim = function() {
          ...
     };
     Anim.method('start', function() {
          ...
     });
     Anim.method('stop', function() {
          ...
     });
方法四（在方法三上增加链式调用）:
     只需要在method方法上添加return this;
     Function.prototype.method =  function(name, fn) {
          this.prototype[name] = fn;
          return this;
     };
第二章
接口模仿

方法一：用注释描述接口
/*
     interface Composite {
          function add(child);
          function remove(child);
     }
*/
 
var CompositeForm = function(id, method, action) { //inplements Composite
     ...
};
 
//继承Composite接口
 
CompositeForm.prototype.add = function(child) {
     ...
};
CompositeForm.prototype.remove = function(child) {
     ...
};
 
缺点：主要利用注释来口头约束，要靠程序员自觉遵守
优点：不需要额外的类或函数，简单方便
 
方法二：用属性检查模仿接口
说明：在方法一中增加代码，主要是在需要继承某些接口的类中添加一个属性用于，告诉别人它有没有继承某些类，此外，再增加一个检查执行的函数，就可以方便的检查某个类是否继承了某些接口
缺点： 如果程序员只是声明了自己有实现那个接口，但是没有实际实现，就会造成问题
优点： 如果程序员正真按照约定，没在代码上说谎，那么就能有效的检测是否实现了接口
例子：
/*
interface Composite {
     function add(child);
     function remove(child);
     function getChild(index);
}
 
interface FormItem() {
     function save();
}
*/
 
var CompositeForm = function(id,method,action) {
     this.implementsInterfaces = ['Composite', 'FormItem'];//类中添加了这个属性，使对象说明自己是否实现了某些类
     ...
}
 
//检查对象是否自己有声称实现了某些接口
function implements(object) {
     for(var i=1; i<arguments.length; i++) {
          var interfaceName = arguments[i];
          var interfaceFound = false;
          for(var j=0; j<object.implementsInterfaces.length; j++) {
               if(object.implementsInterfaces[j] == interfaceName) {
                    interfaceFound = true;
                    break;
               }
          if(!interfaceFound) {
               return false;
          }
          return true;
} 
 
// 使用例子
function addForm(formInstance) {
     if(!implements(formInstance, 'Composite', 'FormItem')) {
          throw new Error("没有实现某些接口");
     }
     ...
}
方法三：鸭式辩型模仿接口
例子：
// 接口列表(个人理解：使用neInterface只是让别人知道这是一个接口定义，简单点可以直接用一个数组来代替）
var Composite = new Interface('Composite', ['add', 'remove', 'getChild']);
var FormItem = new Interface('FormItem', ['save']);
 
//使用的时候通过一个定义好的函数ensureImplements来检查是否实现了接口
ensureImplements(formInstance, Composite, FormItem);
 
说明： 这种方法的思想就是检测对象是否有与接口同名的方法
 
方法四：结合方法一和方法三的方法
例子：
// 接口列表
var Composite = new Interface('Composite', ['add', 'remove', 'getChild']);
var FormItem = new Interface('FormItem', ['save']);
 
// 要实现上述接口的类
var CompositeForm = function(id, method, action) { 
     ... // 实现Composit接口和FormItem接口
};
 
function addForm(formInstance) {
     Interface.ensureImplements(formInstance, Composite, FormItem);
}
 
Interface 类
var Interface = function(name, methods) {
     if(arguments.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, len = methods.length; i< len; 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]);
     }
};
 
// 验证实现的方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
Interface.ensureImplements = function(object) {
    if(arguments.length < 2) {
        throw new Error("Interface.ensureImplements函数接收到的参数个数："+arguments.length+"，但是函数需要的参数个数为：2");
    }
 
    for(var i = 1, len = arguments.length; i < len; i++) {
        var interface = arguments[i];
        if(interface.constructor !== Interface) {
            throw new Error("Interface.ensureImplements函数需要参数2以及后面的参数为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("Interface.ensureImplements函数: 实例没有实现以下方法："+interface.name);
            }
        }
    }
};
综合例子：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<html>
 
<body>
    <script>
        //Interface 类
        var Interface = function (name, methods) {
            if (arguments.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, len = methods.length; i < len; 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]);
            }
        };
 
        Interface.ensureImplements = function (object) {
            if (arguments.length < 2) {
                throw new Error("Interface.ensureImplements函数接收到的参数个数：" + arguments.length + "，但是函数需要的参数个数为：2");
            }
 
            for (var i = 1, len = arguments.length; i < len; i++) {
                var interface = arguments[i];
                if (interface.constructor !== Interface) {
                    throw new Error("Interface.ensureImplements函数需要参数2以及后面的参数为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("Interface.ensureImplements函数: 实例没有实现以下方法：" + interface.name);
                    }
                }
            }
        };
         
        //定义了一个接口,接口需要有run方法和jump方法
        var Animal = new Interface('Animal',['run', 'jump']);
         
        //实现Animal接口的Cat类
        function Cat() {}
        Cat.prototype.run = function() {};
        Cat.prototype.jump = function() {};
         
        //实现Animal接口的Dog类
        function Dog() {}
        Dog.prototype.run = function() {};
        Dog.prototype.jump = function() {};
         
        //没有实现Animal的Car类
        function Car() {}
        Car.prototype.drive = function() {};
         
        //有一只猫叫cat,有一只狗叫dog，有一部车叫car
        var cat = new Cat();
        var dog = new Dog();
        var car = new Car();
         
        //假设一个人叫啊Mark，然后他很喜欢收养动物,今天他又来收养动物了。
        var Mark = {
            adopt: function(animal) {
                Interface.ensureImplements(animal, Animal);
                console.log("收养一只"+animal.constructor.name+"成功");
            }
        };
        Mark.adopt(cat);
        Mark.adopt(dog);
        Mark.adopt(car);
         
    </script>
</body>
 
</html>
 
 
 
 
 
 
 
 
 
 
 
        

《JavaScript设计模式》笔记之第一、二章：富有表现力的JavaScript 和 接口的更多相关文章

  1. 一、富有表现力的JavaScript

    第一章:富有表现力的JavaScript 1.1  JavaScript的灵活性 1.2  弱类型语言 1.3  函数是一等对象 1.4  对象的易变性 1.5  继承 1.6  JavaScript ...

  2. 【总结】富有表现力的JavaScript

    1.JavaScript的灵活性 JavaScript是目前最流行.应用最广泛的语言之一,它是一种极富表现力的语言,它具有C家族语言所罕见的特性.这种语言允许我们使用各种方式来完成同一个任务或者功能, ...

  3. 富有表现力的javascript

    1.javascript的灵活性,你可以把它写的很简单,也可以写的很复杂,简直就是随心所欲: 2.javascript是弱类型语言,定义变量的时候不用声明变量类型,不声明类型,并不是说,javascr ...

  4. Javascript设计模式笔记

    Javascript是越来越厉害了,一统前后端开发.于是最近把设计模式又看了一遍,顺便做了个笔记,以方便自己和他人共同学习. 笔记连载详见:http://www.meteorcn.net/wordpr ...

  5. 《Linux内核设计与实现》 第一二章学习笔记

    <Linux内核设计与实现> 第一二章学习笔记 第一章 Linux内核简介 1.1 Unix的历史 Unix的特点 Unix很简洁,所提供的系统调用都有很明确的设计目的. Unix中一切皆 ...

  6. Android群英传笔记——第十二章：Android5.X 新特性详解，Material Design UI的新体验

    Android群英传笔记--第十二章:Android5.X 新特性详解,Material Design UI的新体验 第十一章为什么不写,因为我很早之前就已经写过了,有需要的可以去看 Android高 ...

  7. [CSAPP笔记][第十二章并发编程]

    第十二章 并发编程 如果逻辑控制流在时间上是重叠,那么它们就是并发的(concurrent).这种常见的现象称为并发(concurrency). 硬件异常处理程序,进程和Unix信号处理程序都是大家熟 ...

  8. o'Reill的SVG精髓（第二版）学习笔记——第十二章

    第十二章 SVG动画 12.1动画基础 SVG的动画特性基于万维网联盟的“同步多媒体集成语言”(SMIL)规范(http://www.w3.org/TR/SMIL3). 在这个动画系统中,我们可以指定 ...

  9. JavaScript学习笔记（第一天）

    javascript个人笔记 JavaScript的组成 JavaScript是一种运行在客户端的脚本语言 ​ ECMAScript 标准----js的基本的语法 DOM------Document ...

随机推荐

  1. Entityframework连接Mysql遇到的问题

    1.mysql.data.entity的版本一定要与mysql-connector-net的版本保持一致,我用的版本是6.9.12 2.有时会遇到连接MySQL数据库时提示missing server ...

  2. hdu-2647 Reward && hdu-2049产生冠军 &&hdu-3342Legal or Not(拓扑排序)

    题目链接: hdu-2647 /*Problem : 2647 ( Reward ) Judge Status : Accepted RunId : 16919085 Language : G++ A ...

  3. Python: PS 滤镜-- 极坐标变换到平面坐标

    本文用 Python 实现 PS 中的一种滤镜 极坐标变换到平面坐标,具体的算法原理和效果可以参考之前的博客: http://blog.csdn.net/matrix_space/article/de ...

  4. C++之萃取技术（traits)

    为什么需要类型萃取(特化) 前面我们提到了迭代器,它是一个行为类似于smart pointer之类的东西,主要用于对STL容器中的对象进行访问,而且不暴露容器中的内部结构,而迭代器所指对象的型别称为该 ...

  5. DAG上的DP

    引例:NYOJ16 矩形嵌套 时间限制:3000 ms  |           内存限制:65535 KB 难度:4   描述 有n个矩形,每个矩形可以用a,b来描述,表示长和宽.矩形X(a,b)可 ...

  6. 二、myeclipse中配置mybatis中xml的自动提示

    以mybatis中mapper.xml为例 方法一: 步骤一:在mybatis-3.3.0.jar包中寻找mybatis-3-mapper.dtd文件. 可以用360压缩打开mybatis-3.3.0 ...

  7. CodeForces 1091G. New Year and the Factorisation Collaboration

    题目简述:若你获得“超能力”:固定$n$,对任意$a$,可以快速求出$x \in [0, n)$(若存在),使得$x^2 \equiv a \pmod n$,若存在多个$x$满足条件,则返回其中一个( ...

  8. CF-805C

    C. Find Amir time limit per test 1 second memory limit per test 256 megabytes input standard input o ...

  9. 招聘.Net中高级软件研发工程师

    岗位职责: 1.参与国土不动产系列软件需求分析.系统架构分析与设计: 2.为产品中的复杂功能编写产品开发需求文档: 3.根据设计文档或需求说明完成代码编写.调试.测试和维护: 4.配合上级进行技术决策 ...

  10. 51nod 1067【简单博弈】

    卧槽,第一次自己推推推做出来的... 对于1,那么就是A取完就好 --A 对于2,只能是A拿一个 --B 对于3和4,都是A拿完 --A 对于5,靠向2,A取3,B只能1 --A 对于6,A取一个的话 ...