美文网首页
初识设计模式

初识设计模式

作者: 谢梦扬_ | 来源:发表于2017-03-29 16:31 被阅读0次

工厂模式

function createPerson(opts){
    var person = {};
    person.name = opts.name || " Chris"
person.sayName = function(){
    console.log(this.name);
}
return person;
}
var p1 = createPerson({name:"Chris"});
var p2 = createPerson({name:"kobe"});
p1.sayName();
p2.sayName();

构造函数模式

  function Person(name, age){
      this.name = name;
      this.age = age;
    }  
  Person.prototype.sayName = function(){
       console.log(this.name);
      }
// 调用
var student = new Person("Chris", 22);
 student.sayName();

模块模式

var student = (function(){
    var name = "Chris";
    function sayName(){
        console.log(name);
    }
    return {
        name: name,
        sayName: sayName
    }
})()
      student.sayName();

单例模式

  // 构造函数的实例只有一个 可以节约内存
  // 一般是通过闭包存储内部实例,通过接口访问内部实例。
var People = (function(){
      var instance;
      function init() {
          this.a = 1;
          this.b = 2;
      }
      return {
          createPeople: function(){
              if(!instance){
                  instance = init();
              }
              return instance;
          }
      }
  })();
  var obj1 = People.createPeople();
  var obj2 = People.createPeople();
  obj1 === obj2 // true

混合模式

  // 就是在原有的对象上面增加、覆盖对象的行为。
  var Person = function(name, age){
      this.name = name;
      this.age = age;
  };
  Person.prototype.sayName = function(){
      console.log(this.name);
  }
  var Student = function(name, age, score) {
      Person.call(this, name, age);
      this.score = score;
  }
  function inherit(superClass, slefClass){
      var _prototype = Object.create(superClass.prototype);
      _prototype.constructor = slefClass;
      slefClass.prototype = _prototype;
  }
  inherit(Person, Student);
  Student.prototype.sayScore = function(){
      console.log(this.score);
  }
var student = new Student("Chris", 22, 100);
student.sayName();
student.sayScore();

发布订阅模式

它定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知。

  var EventCenter =(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){
    delete events[evt]
}
return {
    on: on,
    fire: fire,
    off: off
}
})();

EventCenter.on("my_event", function(data){
    console.log("my_event被监控");
})
EventCenter.on("my_event2", function(data){
console.log("my_event2被监控");
})
EventCenter.fire("my_event");

相关文章

  • 设计模式讲解-第1篇初识设计模式

    设计模式讲解-初识设计模式 设计模式是什么? 设计模式是人们在面对同类型软件工程设计问题所总结出的一些有用的经验(...

  • 初识设计模式

    每一个模式描述了一个在我们周围不断重复发生的问题,以及该问题的解决方案的核心.这样,你就能一次又一次地使用该方法而...

  • 初识设计模式

    工厂模式 构造函数模式 模块模式 单例模式 混合模式 发布订阅模式 它定义了对象间的一种一对多的关系,让多个观察者...

  • Java EE Web应用开发方法

    主要内容 B/S编程模式简介 HTML和HTTP 动态web编程 初识Servlet & JSP MVC设计模式初...

  • 初识设计模式之单例模式

    此文为笔者个人的学习笔记,在学习部分博客、书籍、资料后所总结,仅供参考。 对单例模式的认识单例模式是什么单例模式的...

  • Java入门之初识设计模式---单列模式

    设计模式 是软件开发人员在软件开发过程中面临的一般问题的解决方案 单例模式 目的:使得类的一个对象成为该类系统中的...

  • 设计模式

    常用的设计模式有,单例设计模式、观察者设计模式、工厂设计模式、装饰设计模式、代理设计模式,模板设计模式等等。 单例...

  • 小白的设计模式之旅(初识—责任链模式)

    每个IT小白都有一颗技术大老的心,然而想学会十八般武艺却如蜀道之路步步艰难!想要迈出搬砖的生活,需要去学习技术的深...

  • 设计模式笔记汇总

    目录 设计原则 “依赖倒置”原则 未完待续... 设计模式 设计模式——策略模式 设计模式——装饰者模式 设计模式...

  • 设计模式

    《C#设计模式》 《C#设计模式》-设计模式概述 《C#设计模式》-面向对象设计原则 《C#设计模式》-单例模式 ...

网友评论

      本文标题:初识设计模式

      本文链接:https://www.haomeiwen.com/subject/nzneottx.html