1.寫出 構(gòu)造函數(shù)模式谷炸、混合模式、模塊模式畦徘、工廠模式毕籽、單例模式抬闯、發(fā)布訂閱模式的范例。
-
構(gòu)造函數(shù)模式
function Person (name,age){ this.name = name this.age = age } Person.prototype.sayName = function(){ return this.name } var haoRan = new Person('浩然',24)
-
混合模式
var Person = function(name,age) { this.name = name this.age = age } Person.prototype.sayName = function(){ return this.name } var Student = function(name,age,score){ Person.call(this,name,age) this.score = score } Student.prototype = create(Person.prototype) Student.prototype.sayScore = function(){ console.log(this.score) } function create(parentObj){ function F(){} F.prototype = parentObj return new F(); } var haoRan = new Student('浩然',24,100)
-
模塊模式
var Person = (function(){ var name = '浩然' function sayName(){ console.log(name) } return { name:name, sayName:sayName } })()
-
工廠模式
function createPerson(name,age){ var person = { name: name, age: age, sayName: function(){ return this.name } } return person } var haoRan = createPerson('浩然',24)
-
單例模式
var Person = (function(){ var instance function init(name,age){ return { name: name, age: age } } return { createPerson: function(name,age){ if(!instance){ instance = init(name,age) } return instance } } }()) var haoRan = Person.createPerson('浩然',24)
-
發(fā)布訂閱模式
var EventCenter = (function(){ var events = {} function on (evt ,handler){ events[evt] = events[evt] || [] events[evt].push({ handler: handler }) } function fire(evt,args){ if(!event[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)用
Event.on('change', function(val){
console.log('change... now val is ' + val);
});
Event.fire('change', '饑人谷');
Event.off('changer');
var Event = (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]){
console.log('此名稱下沒(méi)有方法...')
return
}else {
events[evt] = undefined
}
}
return {
on: on,
fire: fire,
off: off
}
})()
Event.on('change', function(val){
console.log('change... now val is ' + val);
});
Event.fire('change', '饑人谷');
Event.off('changer');
Event.off('change');
/**
* 輸出:
* change... now val is 饑人谷
* 此名稱下沒(méi)有方法...
*/