1.寫出 構(gòu)造函數(shù)模式、混合模式诫隅、模塊模式、工廠模式帐偎、單例模式逐纬、發(fā)布訂閱模式的范例。
//1.構(gòu)造函數(shù)模式
//構(gòu)造函數(shù)模式就是使用this聲明變量削樊，然后使用new聲明新對(duì)象
function f1(name,age){
this.age = age;
this.name = name;
}
var p1 = new f1('envy',24);
//2.混合構(gòu)造函數(shù)和原型模式
//在構(gòu)造模式的基礎(chǔ)上添加了原型模式豁生，使用到原型的就是原型模式
function f2(name,age){
this.name = name;
this.age = age;
}
f2.prototype.sayName = function(){
console.log(this.name);
}
var p2 = new f2("envy",23);
//3.模塊模式
//為對(duì)象添加私有變量和方法，并采用對(duì)象字面量的格式返回公有的方法或?qū)傩?/p>
var f3 = function(){
var age = 10;
function sayAge(){
console.log(age);
};
return{
sayAge: sayAge
}
}()
f3.sayAge;
//4.工廠模式
function f4(name,age){
var o = new Object();
o.name = name;
o.age = age;
return o;
}
var p3 = f4('greed',25);
//5.單例模式
var house = function(){
var instance;
function house(){
}
house.prototype = {
setPrice: function(price){
this.price = price;
},
available: function(state){
this.state = state;
},
announce: function(){
console.log('price is: ' + this.price + ', available: ' + this.state);
}
};
if (!instance) {
instance = new house();
}
return instance;
}();
house.setPrice(200);
house.available('yes');
house.announce();
//6.發(fā)布訂閱模式
var EventManager = function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({handler})
}
function fire(evt,args){
if (!events[evt]) {
return;
}
for (var i = 0; i < events[evt].length; i++) {
events[evt][i].handler[args]
}
}
return {
on:on,
fire:fire
}
}();
2.使用發(fā)布訂閱模式寫一個(gè)事件管理器漫贞，可以實(shí)現(xiàn)如下方式調(diào)用甸箱。
Paste_Image.png
var EventManager = (function(){
var events = {};
function on(evt,handler){
events[evt] = events[evt] || [];
events[evt].push({handler:handler})
}
function fire(evt,args){
if (!events[evt]) {
return;
}
for (var i = 0; i < events[evt].length; i++) {
events[evt][i].handler[args]
}
}
function off(evt){
if (!events[evt]) {
return;
}else{
delete events[evt];
}
}
return {
on:on,
fire:fire,
off:off
}
})();
EventManager.on('text:change',function(val){console.log('text:change... now val is' + val);});
EventManager.fire('text:change','饑人谷');
EventManager.off('text:change');
版權(quán)歸ENVY和饑人谷所有，轉(zhuǎn)載請(qǐng)注明出處迅脐。
