原型模式
原型模式(prototype):用原型实例指向创建对象的类,使用于创建新的对象的类共享原型对象的属性以及方法。
原型模式就是将原型对象指向创建对象的类,使这些类共享原型对象的方法与属性。js是基于原型链实现对象之间的继承,这种继承是基于一种对属性或者方法的共享,而不是对属性和方法的复制。
例如一个图片轮播类
var LoopImages = function(imgArr,container){ this.imagesArray = imgArr; //轮播图片数组 this.container = container; //轮播图片容器 this.createImage = function(){}; //创建轮播图片 this.changeImage = function(){}; //切换下一张图片 }
如果有多个轮播图想使用这个类,做出不同的效果,例如上下切换,左右切换,渐隐切换等等多样化的效果,就需要抽象出这样一个基类,然后让不同的效果的类继承这个基类,对于差异化的需求重写这些继承下来的属性。
//上下滑动切换类 var SlideLoopImg = function(imgArr,container){ LoopImages.call(this,imgArr,container); this.changeImage = function(){ console.log("SlideLoopImage changeImage function") } } //渐隐切换类 var FadeLoopImg = function(imgArr,container,arrow){ LoopImages.call(this,imgArr,container); this.arrow = arrow; this.changeImage = function(){ console.log("FadeLoopImage changeImage function") } } //实例化一个渐隐切换图片类 var fadeImg = new FadeLoopImg(['1.jpg','2.jpg'],'slide',['left.jpg','right.jpg']) fadeImg.changeImage(); //FadeLoopImage changeImage function
基类要被子类继承,此时将属性和方法都写在基类的构造函数会有问题,每次继承都要创建一次父类,方法不是共享的而是重新创建生成的,所以将一些简单而有差异化的属性放在构造函数中,剩下的复杂的方法可以放在基类的原型中,可以避免很多不必要的消耗。
原型模式就是将可复用的、可共享的、耗时大的从基类中提取出来然后放在原型中,然后子类通过组合继承或者寄生组合式继承而将方法和属性继承下来,对于子类中那些需要重写的方法进行重写,这样子类创建的对象既有子类的属性和方法也共享了基类的原型方法。
var LoopImages = function(imgArr,container){ this.imagesArray = imgArr; //轮播图片数组 this.container = container; //轮播图片容器 } LoopImages.prototype = { createImage : function(){}; //创建轮播图片 changeImage : function(){}; //切换下一张图片 } //(组合继承) //上下滑动切换类 var SlideLoopImg = function(imgArr,container){ LoopImages.call(this,imgArr,container); } SlideLoopImg.prototype = new LoopImages(); SlideLoopImg.prototype.changeImage = function(){ console.log("SlideLoopImage changeImage function") } //渐隐切换类 var FadeLoopImg = function(imgArr,container,arrow){ LoopImages.call(this,imgArr,container); this.arrow = arrow; } FadeLoopImg.prototype = new LoopImages(); FadeLoopImg.prototype.changeImage = function(){ console.log("FadeLoopImage changeImage function") }
原型模式有一个特点就是在任何时候都可以对基类或者子类进行方法拓展,而且所有被实例化的对象或者类都能获取这种方法
设计模式 文章被收录于专栏
设计模式