码迷,mamicode.com
首页 > Web开发 > 详细

js设计模式

时间:2018-04-01 16:58:48      阅读:207      评论:0      收藏:0      [点我收藏+]

标签:return   工厂模式   proc   define   obj   add   lis   tor   reac   

单例模式

let obj = {
  name: ‘xx‘,
  age: 20
}

工厂模式

function Person() { this.name = ‘Person1‘; }
function Animal() { this.name = ‘Animal1‘; }

function Factory() {}
Factory.prototype.getInstance = function(className) {
  return eval(‘new ‘ + className + ‘()‘);
}

var factory = new Factory();
var obj1 = factory.getInstance(‘Person‘);
var obj2 = factory.getInstance(‘Animal‘);
console.log(obj1.name); // Person1
console.log(obj2.name); // Animal1

代理模式

function Person() { }
Person.prototype.sayName = function() { console.log(‘michaelqin‘); }
Person.prototype.sayAge = function() { console.log(30); }

function PersonProxy() { 
  this.person = new Person();
  const that = this;
  this.callMethod = function(functionName) {
    console.log(‘before proxy:‘, functionName);
    that.person[functionName](); // 代理
    console.log(‘after proxy:‘, functionName);
  }
}

var pp = new PersonProxy();
pp.callMethod(‘sayName‘); // 代理调用Person的方法sayName()
pp.callMethod(‘sayAge‘); // 代理调用Person的方法sayAge()    

观察订阅者模式

function Publisher() {
  this.listeners = [];
}
Publisher.prototype = {
  addListener(listener){
    this.listeners.push(listener);
  },
  removeListener(listener){
    delete this.listeners[listener];
  },
  notify(obj){
    this.listeners.forEach(listener => {
      if(typeof listener !== ‘undefined‘){
        listener.process(obj);
      }
    })
  }
}
function Subscriber() {
  
}
Subscriber.prototype = {
  process(obj){
    console.log(obj)
  }
}

const p = new Publisher();

 

js设计模式

标签:return   工厂模式   proc   define   obj   add   lis   tor   reac   

原文地址:https://www.cnblogs.com/colima/p/8687123.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!