设计模式之 - 原型模式（创建型设计模式）

原型模式 将原型对象指向创建对象的类，使这些类共享原型对象的属性和方法。

这是基于 JS 原型链实现对象之间的继承，这种继承是一种属性或方法的共享，而不是对属性和方法的复制。

在创建的类中，存在基类，其定义的属性和方法能被子类继承。

原型模式将可复用的、可共享的、耗时较长的从基类中提出来放在基类的原型中，然后子类通过组合继承或寄生组合式继承把属性和方法继承下来，对于子类中那些需要重写的方法进行重写，这样子类创建的对象既具有子类的属性和方法同时也共享了基类的原型方法。

例子
比如页面中经常见到的焦点图，焦点图的切换效果都是多变的，有左右切换的，有上下切换的还有渐隐切换的等等。因此我们应该抽象出一个基类，根据不同需求来重写继承的属性和方法。

代码

function LoopImage(imgArr,container){
	this.imgArr = imgArr;
	this.container = container;
	this.createImg = function(){} // 创建轮播图片
	this.changeImg = function(){} // 切换下一张图片
}
// 上下切换效果
function SlideLoopImg(imgArr,container){
	LoopImage.call(this,imgArr,container);
	this.changeImg = function(){
		console.log("SlideLoopImg changeImg");
	}
}
// 渐隐切换效果
function FadeLoopImg(imgArr,container,arrow){
	LoopImage.call(this,imgArr,container);
	// 切换箭头私有变量
	this.arrow = arrow;
	this.changeImg = function(){
		console.log("FadeLoopImg changeImg");
	}
}

// 实例化一个渐隐切换效果图片类
let fadeImg = new FadeLoopImg(["01.jpg","02.jpg"],"slide",["left.jpg","right.jpg"]);
fadeImg.changeImg(); // FadeLoopImg changeImg

如上代码还存在一些问题，首先看我们的基类 LoopImg，作为基类是要被子类继承的，那么此时将属性和方法都写在基类的构造函数里就会有一些问题，比如每次子类继承父类都要重新创建一次，又或者父类中的构造函数中存在很多耗时长的逻辑，亦或者每次初始化都是一些重复性的东西，对性能的消耗很多。

所以我们需要一种共享机制，这样每当创建基类的时候，对于一些简单或者差异化的东西放在构造函数内，对于可重复，耗时长的逻辑放在基类的原型中。这样就可以避免损耗性能。

function LoopImage(imgArr,container){
	this.imgArr = imgArr;
	this.container = container;
}
LoopImage.prototype.createImg = function(){} // 创建轮播图片
LoopImage.prototype.changeImg = function(){} // 切换下一张图片
// 上下切换效果
function SlideLoopImg(imgArr,container){
	LoopImage.call(this,imgArr,container);
}
SlideLoopImg.prototype = new LoopImage();
SlideLoopImg.prototype.changeImg = function(){
	console.log("SlideLoopImg changeImg");
}
// 渐隐切换效果
function FadeLoopImg(imgArr,container,arrow){
	LoopImage.call(this,imgArr,container);
	// 切换箭头私有变量
	this.arrow = arrow;
}
FadeLoopImg.prototype = new LoopImage();
FadeLoopImg.prototype.changeImg = function(){
	console.log("FadeLoopImg changeImg");
}

// 实例化一个渐隐切换效果图片类
let fadeImg = new FadeLoopImg(["01.jpg","02.jpg"],"slide",["left.jpg","right.jpg"]);
fadeImg.changeImg(); // FadeLoopImg changeImg

原型对象是一个共享的对象，不管是父类的实例对象还是子类的继承，都是靠一个指针引用的。所以在任何时候对基类或者子类的原型进行拓展，所有实例化的对象或者类都能获取到这些方法。