1、写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。
构造函数:
function Person(name,job){
this.name=name;
this.job=job;
this.Introduce=function(){
console.log(this.name+','+this.job)
}
}
var person1=new Person('八戒','拍马屁')
person1.Introduce()//八戒,拍马屁
混合模式:
var Person =function(name,age){
this.name=name;
this.age=age;
}
Person.prototype.sayName=function(){
console.log(this.name+this.age)
}
var Student=function(name,age,score){
Person.call(this,name,age);
this.score=score;
}
Student.prototype=Object.create(Person.prototype)
var student=new Student('张三','25','99')
student.sayName()//张三,25
模块模式:
var Person=(function(){
var name='张三';
function sayName(){
console.log(name)
}
return{
name:name,
sayName:sayName
}
})()
undefined
Person.name//"张三"
Person.sayName()// 张三
工厂模式:
function Person(name,job){
var obj={};
obj.name=name;
obj.job=job;
obj.introduce=function(){
console.log(this.name+','+this.job)
};
return obj
}
var person2=new Person('悟空','牵马')
person2.introduce()// 悟空,牵马
单例模式:
var single=(function(){
var obj;
function getobj(name){
if(obj){
return obj
}
obj=new createobj(name)
}
function createobj(name){
this.name=name
}
return{
geto:getobj
}
})()
发布订阅模式:
var eventCenter=(function(){
var clientList={};
on=function(key,fn){
if(!clientList[key]){
clientList[key]=[]
}
clientList[key].push({
fn:fn
})
}
fire=function(key,args){
if(!clientList[key]){
return
}
for(var i=0;i<clientList[key].length;i++){
clientList[key][i].fn()
}
}
return{
on:on,
fire:fire
}
})()
//每个人先订阅到货通知,通过fire遍历向每个订阅的人发送消息
eventCenter.on('到货通知',function(){console.log('狗蛋需要房子,到货提醒他')})
eventCenter.on('到货通知',function(){console.log('狗娃需要房子')})
eventCenter.on('到货通知',function(){console.log('二狗子需要房子2')})
eventCenter.on('到货通知',function(){console.log('三狗子需要房子3')})
eventCenter.fire('到货通知')
2、使用发布订阅模式写一个事件管理器,可以实现如下方式调用
Event = (function() {
var clientList = {};
function on(evt, fn) {
if (!clientList[evt]) {
clientList[evt] = []
}
clientList[evt].push({
fn: fn
})
}
function fire(evt, val) {
if (!clientList) {
return
}
for (var i = 0; i < clientList[evt].length; i++) {
clientList[evt][i].fn(val)
}
}
function off(evt) {
if (!clientList[evt].length) {
return
}
var len = clientList[evt].length
for (var i = 0; i < len; i++) {
clientList[evt].pop()
}
}
return {
on: on,
fire: fire,
off: off
}
})()
Event.on('change', function(val) {
console.log('change... now val is ' + val);
});
Event.on('change', function(val) {
console.log('用户1 ' + val);
});
Event.on('change', function(val) {
console.log('用户2 ' + val);
});
Event.on('change', function(val) {
console.log('用户3 ' + val);
});
//Event.fire('change', '饥人谷');
//Event.off('change');
网友评论