看书JavaScript设计模式 笔记(二)

(1)简单工厂模式(静态工厂方法)

 在使用类的方法来写代码的时候,我们会发现我们会写很多的类,而每次new一个实例,我们都得先清楚了解,各个类的用处,对于我们自己书写的类来说用起来很方便,但是当团队的人员使用我们写的类的时候,就必须一一对应我们写的类来实例化,这样团队协作起来十分麻烦.

所以我们得使用简单工厂模式来进一步的改造我们的代码,什么是工厂大家都很熟悉,工厂就是制造一些物件,如果我们投入的原材料是布,那么他就会制造出布料衣裳,投入丝绸,那么我们就得到丝绸衣服,我们使用工厂的时候并不需要知道工厂哪个部门或者在哪给我们制造出来的,我们只需要知道有这么个工厂,并把原材料投入,这个工厂就会把我们想要的结果返回回来,比如

 var Cotton = function(){ //基类
	 	this.intro = '这是棉做的衣服';
	 }
	 Cotton.prototype = {
	 	getWarning:function(){
	 		console.log('中性洗衣粉常温手洗,不能置于阳光下暴晒');
	 	}
	 }
	 var Silk = function() //基类
	 {
	 	this.intro = '这是丝绸做的衣服';
	 }
	 Silk.prototype = {
	 	getWarning:function (){
	 		console.log('把衣服洗净,最好熨烫一遍')
	 	}
	 }
	 var ClothFactory = function (cloth)  //工厂
	 {
	 	switch(cloth){
	 		case 'cotton' :return new Cotton();
	 		case 'silk' : return new Silk();
	 	}
	 }
	 var cloth1 = new ClothFactory('cotton');
	 console.log(cloth1);

(二)工厂方法模式

  当工厂的功能越来越多,能制造的东西越来越多,我们会发现,我们添加一个工厂的功能,就必须得新增一个基类,并且修改工厂函数.这样操作就又比较的麻烦,为了解决这个问题推出了工厂方法模式,这种模式提供我们只修改原型链上的方法,例:

var ClothFactory = function (cloth)
	 {
	 	if(this instanceof ClothFactory)
	 	{
	 		var s = new this[cloth];
	 		return s;
	 	}
	 	else 
	 	{
	 		return new ClothFactory(cloth)
	 	}
	 }	
	 ClothFactory.prototype = {
	 	cotton :function (){
	 		this.intro = '这是棉做的衣服';
	 		this.getWarning = function(){
	 			console.log('中性洗衣粉常温手洗,不能置于阳光下暴晒');
	 		}
	 	},
	 	silk:function(){
	 		this.intro = '这是丝绸做的衣服';
	 		this.getWarning = function (){
	 		console.log('把衣服洗净,最好熨烫一遍')
	 	}
	 	}
	 }
	 var cloth1 = new ClothFactory('cotton');
	 console.log(cloth1)

(三)建造者模式

我们使用前面的工厂模式的时候都是只关心了它的结果,并没有关心他是如果生产出我们想要的产品,而建造者模式就会让你看到他的一些制造过程.我们首先会创建一个缓存的对象,而这个缓存对象就会有些属性需要我们修饰,比如我们创建一个简单的个人名片

var Name = function (name)
	{
		var that = this;
		(function (name,that) {
			that.wholeName = name;
			if(name.indexOf(' ')>-1){
				that.firstName = name.slice(0,name.indexOf(' '));
				that.secondName = name.slice(name.indexOf(' '));
			}
		})(name,that)
	}
	var Work = function (work)
	{
		var that = this;
		(function (work,that){
			that.work = new that[work];
		})(work,that)
	}
	Work.prototype = {
		teach:function (){
			console.log('我是人民教师');
		}
	}
	var businessCard = function (name, work)
	{
	 	var _person = new Object();
	 	_person.name = new Name(name);
	 	_person.work = new Work(work);
	 	return _person;
	}
	var teachCard = new businessCard('xiao ming','teach');

(四)原型模式

原型模式就是将可复用的,可共享的,耗时大的基类提出来,然后放在其原型中,原型模式的对象复制

function prototyExtend (){
		var F = function (){
			args = arguments;
			i = 0;
			len = args.lengtn;
			for(;i<len;i++){
				for(var j in args[i]){
					F.prototype[i] = args[i][j];
				}
			}
		}
		return new F();
	}

(五)单例模式(单体模式)

单例就是保证一个类只有一个实例,实现的方法一般是先判断实例是否存在,如果存在就直接返回,就确保了一个类只有一个实例对象.在JavaScript里,单例作为一个名命空间提供者,从全局名命空间里提供唯一的访问点来访问该对象.

 var singleton = function( fn ){
    var result;
    return function(){
        return result || ( result = fn .apply( this, arguments ) );
    }
}

    var createMask = singleton( function(){
        return document.body.appendChild( document.createElement('div') );
    })
createMask();

猜你喜欢

转载自blog.csdn.net/weixin_40518538/article/details/82148675
今日推荐