读《javascript设计模式》第一章有感而发
因为最近一个项目需要用面向对象书写,所以看了下张容铭老师的《javascript设计模式》,虽然才只看了一章,但是感触颇深,自己笔记记:
因为需要定义个大构造函数,函数内部有很多自己公用的方法,平时就是设置一个方法函数function 方法(){}//然后直接在构造函数内部this.show进行调用
现在自己总结三种可以”使用公共方法函数”的方法:(可能都很拙劣,但是做笔记用):
第一种:
//第一种,外部函数回调调用
function MyConstructor() {
this.show = function (callback) {
var a = '做事需要的参数'
callback.call(this,a)
};
this.addEvent = function () {
};
}
//平时这个函数是写构造函数内部的,直接调用,但是需要写回调所以放到外面
function public (a) {
console.log('我要干的事:'+a+"->接下来写方法")
}
var my = new MyConstructor();
my.show(public)
//打印结果:我要干的事:做事需要的参数->接下来写方法
第二种:
//第二种 :构造函数内部调用自己的方法
function MyConstructor() {
this.show = function (callback1,callback2) {
var a = '做事需要的参数'
callback1.call(this,a)
callback2.call(this,a)
};
this.addEvent = function () {
};
this.publicMethods ={
public1:function (a) {
console.log('我要干的事:'+a+"->接下来写方法")
},
public2:function (a) {
console.log('我要干的事:'+a+"->接下来写方法")
}
}
}
var my = new MyConstructor();
my.show(my.publicMethods.public1,my.publicMethods.public2)
//打印结果:我要干的事:做事需要的参数->接下来写方法;我要干的事:做事需要的参数->接下来写方法
第三种:(也是看设计模式有感而发)
//第三种:构造函数内或者外定义公用大F的链式叠加,然后new 实例化进行调用
function MyConstructor() {
this.show = function (callback) {
var a = '做事需要的参数';
publicMethods.public1(a);
callback?callback.call(this,a):null
return this;//进行链式调用
};
this.addEvent = function () {
//addEvent内部需要使用公用方法1,进行调用传入参数
var a = '我是方法1'
publicMethods.public2(a);
return this;//进行链式调用
};
//--> 此段容如果放到 构造函数 外面,其实可以作为回调函数用的,参考第一种但是个人考虑公用F的污染的问题,还是放到 构造函数内
//定义公用大F的链式叠加添加方法函数
Function.prototype.addMthod = function (name,fn) {
this.prototype[name] = fn;
return this; //进行链式添加
}
//定义方法函数进行添加
var AddMethods = function(){};
AddMethods.addMthod('public1',function (a) {
console.log('公用函数1要做的事'+a)
return this; //进行链式调用,但是如果有参数进行操作的话,是不能返回当前this的
}).addMthod('public2',function (a) {
console.log('公用函数2要做的事')
return this; //进行链式调用,但是如果有参数进行操作的话,是不能返回当前this的
})
//进行调用
var publicMethods = new AddMethods();
/* 注释1
* publicMethods.public1().public2()
*/
//-->
}
//当实例化成功后,(注释1)中内部的公用方法就实现了调用,但是这些方法是要在构造函数内部调用的,所以不需要直接调用
var my = new MyConstructor();
my.show().addEvent() //打印结果:公用函数1要做的事做事需要的参数;公用函数2要做的事
本来我是研究第三种方法的,感觉和以前写的不一样,但是写完三种方法后,感觉各有自己的特点吧,第二种方法也不错,这些其实还是有优化的地方,只是做个笔记用。