JavaScript设计模式基础-----封装、继承、多态

// 函数的基本形式
function checkName() {
    "use strict";

}
function checkEmail() {
    "use strict";

}
function checkPassword() {
    "use strict";

}

// 函数的另一种形式
var checkName = function () {
    "use strict";

}
var checkEmail = function () {
    "use strict";

}
var checkPassword = function () {
    "use strict";

}

// 上面两种等于声明了全局变量
// 这个从功能上讲是没有问题的，但是如果别人也定义了同样的方法就会覆盖掉这个函数

/*
 * 用对象收编变量
 * */
var CheckObject = {
    checkName: function () {
        "use strict";

    },
    checkEmail: function () {
        "use strict";

    },
    checkPassword: function () {
        "use strict";

    }
}

// 将所有的函数作为checkObject的方法，这样就只有一个对象 用法：CheckObject.checkName()

/*
 * 对象的另一种形式
 * */
var CheckObject = function () {

}
CheckObject.checkName = function () {
    "use strict";

}
CheckObject.checkEmail = function () {
    "use strict";

}
CheckObject.checkPassword = function () {
    "use strict";

}
//用法：CheckObject.checkName()  不好处就是比人不能复制你的代码，这个对象在用new关键字创建新对象的时候新创建的对象是不能继承这些方法的

/*
 * 实现简单复制
 * */
var CheckObject = function () {
    "use strict";
    return {
        checkName: function () {
            "use strict";

        },
        checkEmail: function () {
            "use strict";

        },
        checkPassword: function () {
            "use strict";

        }
    }
}
// 这样每个人用的时候都是返回一个新对象 通过new 实例化的时候 互不影响
// 用法：var a= CheckObject(); a.checkName();

/*
 * 用类的写法 每次new的时候新创建的对象都会有一套自己的方法，这样很消耗内存
 * */
var CheckObject = function () {
    "use strict";
    this.checkName = function () {

    }
    this.checkEmail = function () {

    }
    this.checkPassword = function () {

    }
}
// 用法：var a = new CheckObject(); a.checkPassword();

/*
 这个对象创建出来的方法就都是相同的，因为他们都需要一来prototype原型一次查找
 * */
var CheckObject = function () {
    "use strict";

}
CheckObject.prototype.checkName = function () {
    "use strict";

}
CheckObject.prototype.checkEmail = function () {

}
CheckObject.prototype.checkPassword = function () {

}
//简写
var CheckObject = function () {
}
CheckObject.prototype = {
    checkName: function () {
        "use strict";

    },
    checkEmail: function () {
        "use strict";

    },
    checkPassword: function () {
        "use strict";

    }
}
// 用法：var a = new CheckObject(); a.checkName();
// =================== 注意==========================
// 这两种方法不能一起用 一起用的话 后面的prototype 方法会覆盖前面的

var CheckObject = {
    checkName: function () {
        "use strict";
        return this;
    },
    checkEmail: function () {
        "use strict";
        return this;
    },
    checkPassword: function () {
        "use strict";
        return this;
    }
}
// 链式调用
// CheckObject.checkName().checkEmail();
// 也可以放到原型中
var CheckObject = function () {
    "use strict";

}
CheckObject.prototype = {
    checkName: function () {
        "use strict";
        return this;

    },
    checkEmail: function () {
        "use strict";
        return this;

    },
    checkPassword: function () {
        "use strict";
        return this;
    }
}
// 用法：var a = new CheckObject(); a.checkName().checkEmail();

/*
 为函数的原型添加方法
 * */
Function.prototype.addMethod = function (name, fn) {
    this[name] = fn; // 如果要添加到prototype上 使用的时候要使用new 关键字 this.prototype[name]=fn; 使用的时候要使用new
    return this;
}
var methods = new function ();
methods.addMethod('checkName', function () {
    // 如果要链式调用 返回this

}).addMethod('checkEmail', function () {

});
methods.chekcName();

// ============================ 面向对象 ============================ //

// 创建一个类
var Book = function (id, bookname, price) {
    this.id = id;
    this.bookname = bookname;
    this.price = price;
}
// 为类添加方法
Book.prototype = {
    display: function () {

    }
}

// 封装
var Book = function (id, name, price) {
    // 私有属性 相当于php private 定义的方法
    var num = 1;
    // 私有方法
    function checkId() {

    }

    // 特权方法  相当于php为变量设置和获取值的方法
    this.getName = function () {

    }
    this.setName = function () {

    }
    this.getPrice = function () {

    }
    this.setPrice = function () {

    }

    // 公有属性 相当于php的public定义的属性和方法 【这相当于css的style 优先级要比prototype的高】
    this.id = id;
    // 公有方法
    this.copy = function () {

    }

    // 构造器 相当于php的__construct
    this.setName(name);
    this.setPrice(price);
}
// 类外部通过 . 语法定义的属性和方法 称为 静态公有属性和方法 但是对象不能访问 相当于php static 定义的属性和方法 只能通过类名.属性、方法访问
Book.isChinese = true;
Book.resetTime = function () {
    console.log('new time')
}
// 通过prototype定义的属性和方法称为公有属性和方法
Book.prototype = {
    // 公有属性
    isJsBook: false,
    // 公有方法
    display: function () {

    }
}
// 用法 ： var b= new Book(11,'JavaScript设计模式',50);

/*
 * 升级版本的封装 function 对象的
 * */

function Person(info) {
    this._init_(info)
}
Person.prototype = {
    constructor: Person,
    _init_: function (info) {
        this.name = info.name;
        this.age = info.age;
        this.sex = info.sex;
    },
    sayHello: function () {
        console.log('hello');
    }
}

/*
 * 升级版本2  仿照jquery
 * */
var Person = (function (window) {
    var Person = function (name) {
        // 直接实例化
        return new Person.fn.init(name);
    }

    Person.fn = Person.prototype = {
        constructor: Person,
        init: function (name) {
            this.name = name;
            this.sayHello = function () {
                this.makeArray();
            }
        },
        makeArray: function () {
            console.log(this.name);
        }
    }

    Person.fn.init.prototype = Person.fn;

    return Person;
})();
/*
 var p = Person('pawn');
 console.log(p);
 p.sayHello();
 */

每个类都有三部分组成
1.
构造函数内部的这是供实例化对象复制用的
2.
构造函数外部的直接通关.语法添加的
只是类使用的
只有类.才可以访问
3.
添加在prototype中的
实例化对象时可以通过原型直接访问到
是给所有实例化对象所共用的

/*
 * 继承 http://www.cnblogs.com/humin/p/4556820.html
 * */
// 定义一个动物类
function Animal(name) {
    // 属性
    this.name = name || 'Animal';
    // 实例方法
    this.sleep = function () {
        console.log(this.name + '正在睡觉！');
    }
}
// 原型方法
Animal.prototype.eat = function (food) {
    console.log(this.name + '正在吃：' + food);
};

//1、原型链继承
//核心： 将父类的实例作为子类的原型

function Cat() {
}
Cat.prototype = new Animal();
Cat.prototype.name = 'cat';

//　Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.eat('fish'));
console.log(cat.sleep());
//instanceof主要的目的是检测引用类型
//typeof 是一个操作符,主要的目的是检测一个变量是不是基本数据类型的变量
console.log(cat instanceof Animal); //true
console.log(cat instanceof Cat); //true

/*特点：

 非常纯粹的继承关系，实例是子类的实例，也是父类的实例
 父类新增原型方法/原型属性，子类都能访问到
 简单，易于实现

 缺点：

 要想为子类新增属性和方法，必须要在new Animal()这样的语句之后执行，不能放到构造器中
 无法实现多继承
 来自原型对象的引用属性是所有实例共享的（详细请看附录代码： 示例1）
 创建子类实例时，无法向父类构造函数传参
 推荐指数：★★（3、4两大致命缺陷）*/

//2、构造继承
//核心：使用父类的构造函数来增强子类实例，等于是复制父类的实例属性给子类（没用到原型）
function Cat(name) {
    "use strict";
    Animal.call(this);
    this.name = name || 'Tom';
}
// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // false
console.log(cat instanceof Cat); // true

/*特点：

 解决了1中，子类实例共享父类引用属性的问题
 创建子类实例时，可以向父类传递参数
 可以实现多继承（call多个父类对象）
 缺点：

 实例并不是父类的实例，只是子类的实例
 只能继承父类的实例属性和方法，不能继承原型属性/方法
 无法实现函数复用，每个子类都有父类实例函数的副本，影响性能
 推荐指数：★★（缺点3）*/

//3、实例继承
//核心：为父类实例添加新特性，作为子类实例返回
function Cat(name) {
    "use strict";
    var instance = new Animal();
    instance.name = name || 'Tom';
    return instance;
}

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // true
console.log(cat instanceof Cat); // false
/*
 特点：

 不限制调用方式，不管是new 子类()还是子类(),返回的对象具有相同的效果
 缺点：

 实例是父类的实例，不是子类的实例
 不支持多继承
 推荐指数：★★*/


//4、拷贝继承

function Cat(name) {
    var animal = new Animal();
    for (var p in animal) {
        Cat.prototype[p] = animal[p];
    }
    Cat.prototype.name = name || 'Tom';
}

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // false
console.log(cat instanceof Cat); // true
/*特点：

 支持多继承
 缺点：

 效率较低，内存占用高（因为要拷贝父类的属性）
 无法获取父类不可枚举的方法（不可枚举方法，不能使用for in 访问到）
 推荐指数：★（缺点1）*/

/*
 5、组合继承

 核心：通过调用父类构造，继承父类的属性并保留传参的优点，然后通过将父类实例作为子类原型，实现函数复用
 */

function Cat(name) {
    Animal.call(this);
    this.name = name || 'Tom';
}
Cat.prototype = new Animal();

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // true
console.log(cat instanceof Cat); // true
/*特点：

 弥补了方式2的缺陷，可以继承实例属性/方法，也可以继承原型属性/方法
 既是子类的实例，也是父类的实例
 不存在引用属性共享问题
 可传参
 函数可复用
 缺点：

 调用了两次父类构造函数，生成了两份实例（子类实例将子类原型上的那份屏蔽了）
 推荐指数：★★★★（仅仅多消耗了一点内存）*/

/*
 6、寄生组合继承

 核心：通过寄生方式，砍掉父类的实例属性，这样，在调用两次父类的构造的时候，就不会初始化两次实例方法/属性，避免的组合继承的缺点
 */

function Cat(name) {
    Animal.call(this);
    this.name = name || 'Tom';
}
(function () {
    // 创建一个没有实例方法的类 在js 中 继承是依赖于原型prototype链实现的
    var Super = function () {
    };
    Super.prototype = Animal.prototype;
    //将实例作为子类的原型
    Cat.prototype = new Super();
})();

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof Animal); // true
console.log(cat instanceof Cat); //true
/*
 特点：

 堪称完美
 缺点：

 实现较为复杂
 推荐指数：★★★★（实现复杂，扣掉一颗星）
 */

//=============================================javascript 多继承========================================================
// 在JavaScript中继承是一来与prototype链实现的。因为只有一条原型链。理论上是不能继承多个父类，但是js是很灵活的。通过一些
//技巧和方法可以实现多继承
/**
 * 作用就是将传入的多个对象的属性复制到源对象中 这样就可以实现对多个对象属性的继承
 * 使用的时候第一个参数----需要传入要继承的对象
 * @returns {*}
 */
var mix = function () {
    var i = 1,// 从第一个参数起为被继承的对象
        len = arguments.length,// 获取参数长度
        target = arguments[0],// 第一个对象为目标对象
        arg;// 缓存参数对象
    for (; i < len; i++) {
        // 缓存当前对象
        arg = arguments[i];
        // 遍历被继承对象中的属性
        for (var property in arg) {
            // 将被继承对象中的属性复制的目标对象中
            target[property] = arg[property];
        }
    }
    return target;
};

Object.prototype.mix = function () {
    var i = 0, // 从第一个参数起为被继承的对象
        len = arguments.length, // 获取参数长度
        arg;// 缓存参数对象
    // 遍历被继承的对象
    for (; i < len; i++) {
        // 缓存当前对象
        arg = arguments[i];
        // 遍历被继承对象中的属性
        for (var property in arg) {
            // 将被继承对象中的属性复制的目标对象中
            this[property] = arg[property];
        }
    }
};

var book1 = {
    name: 'book1',
    alike: ['css', 'js', 'java']
};
var book3 = {
    names: 'book1',
    alikes: ['css', 'js', 'java']
};
var book2 = {
    ccc: 'ccccccc'
};
var outhorBook = {
    color: 'red'
};
outhorBook.mix(book1, book2, book3);
console.log(outhorBook);

/*
 * ============================================= 多态 =============================================
 * 指的是同一种方法多种调用方式
 * */
function add() {
    // 获取参数
    var arg = arguments,
    // 获取长度
        len = arg.length;
    switch (len) {
        // 如果没有传参数
        case 0:
            return 10;
        case 1:
            return 10 + arg[0];
        case 2:
            return arg[0] + arg[1];
    }
}
console.log(add()); // 10
console.log(add(5)); // 15
console.log(add(6, 7)); // 13

// or
function Add() {
    function zero() {
        return 10;
    }

    function one(num) {
        return 10 + num;
    }

    function two(num1, num2) {
        return num1 + num2;
    }

    // 相加共有方法
    this.add = function () {
        var arg = arguments,
            len = arg.length;
        switch (len) {
            case 0:
                return zero();
            case 1:
                return one(arg[0]);
            case 2:
                return two(arg[0], arg[1])
        }
    }
}
var a = new Add();
console.log(a.add());
console.log(a.add(5));
console.log(a.add(6, 7));