前端设计模式

1、写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。

构造函数模式：

function Person(name,age) {
  this.name = name
  this.age = age
}
Person.prototype.sayName = function () {
  return this.name
}
var student = new Person('XiaoMing', 18)
console.log(student)

混合模式：

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
}
Student.prototype = create(Person.prototype)
function create (parentObj) {
  function F() {}
  F.prototype = parentObj
  return new F()
}
Student.prototype.sayScore = function () {
  console.log(this.score)
}
var student = new Student('XiaoMing',18,95)
console.log(student)

模块模式：

var Person = (function () {
  var name = 'XiaoMing'
  function sayName() {
    console.log(name)
  }
  return {
    name: name,
    sayName: sayName
  }
})()

工厂模式：

function createPerson(name) {
  var person = {
    name: name,
    sayName: function () {
      console.log(this.name)
    }
  }
  return person
}
var p1 = createPerson('XiaoMing')
var p2 = createPerson('XiaoHong')

单例模式：

var People = (function () {
  var instance
  function init(name) {
    return {
      name: name
    }
  }
  return {
    createPeople: function (name) {
      if (!instance) {
        instance = init(name)
      }
      return instance
    }
  }
}())
var obj1 = People.createPeople('XiaoMing')
var obj2 = People.createPeople('XiaoHong')

发布订阅模式：

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

2、使用发布订阅模式写一个事件管理器，可以实现如下方式调用：

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