1.写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。
构造函数模式
function Person(name, age){
this.name = name
this.age = age
}
Person.prototype = {
sayName: function(){
console.log(this.name)
}
}
var person1 = new Person('小王', 22)
person1.sayName() //小王
构造函数模式是创建特定类型的对象的一种模式，把私有属性绑定到函数内部的this上，把一些共有方法写到函数的原型链上, 然后通过new 关键字来创建一个实例对象。
工厂模式
function createPerson(name, age){
var person = {
name: name,
age: age,
sayName: function(){
console.log(this.name)
}
}
return person
}
var person1 = createPerson('小王', 22)
var person2 = createPerson('老王', 24)
工厂模式可以无数次地调用这个函数，在该例中都会返回一个包含2个属性一个方法的对象。但不能解决对象的识别问题。
单例模式
var Person = (function(){
var instance;
function init(name){
return {
name: name
}
}
return {
createPerson: function(name){
if (!instance) {
instance = init(name)
}
return instance
}
}
})()
Person.createPerson('小王') //小王
Person.createPerson('小黄') //小黄
单例模式：保证一个类仅有一个实例，并提供一个访问它的全局访问点。
单例模式是一种常用的模式，节约内存。有一些对象我们往往只需要一个。例如，当我们点击登录按钮时，页面会弹出一个登录悬浮窗，而这个登录悬浮窗是唯一的，无论点击多少次登录按钮，这个悬浮窗只会被创建一次，这时，这个悬浮窗就适合用单例模式来创建。
混合模式
function Person(name, age){
this.name = name
this.age = age
}
Person.prototype = {
sayName: function(){
console.log(this.name)
}
}
function Student(name, age, score){
Person.call(this, name, age)
this.score = score
}
var fn = function(){}
fn.prototype = Person.prototype
Student.prototype = new fn() //实现继承
var a = new Student('chen', '24', 22)
a.sayName() //chen
建立在构造函数模式的基础上，实现子类继承父类的属性和方法，子类可以在扩展属性和方法。
模块模式
var Person = (function(){
var name = 'css'
function sayName(){
console.log(name)
}
return {
name: name,
sayName: sayName() //css
}
})() //通过闭包来实现一个模块
使用立即执行函数包裹代码段，使内部的私有变量和方法不会暴露出来，通过return函数给外部提供使用内部方法的接口。
这样的好处是不会污染全局变量，外部无法访问或者改变模块内部的变量和方法。
2.使用发布订阅模式写一个事件管理器，可以实现如下方式调用
var Event = (function(){
var events = {} //储存key:value
function on(evt, handler){
events[evt] = events[evt] || []
//events['key'] = [{handler: function(){}}]
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,
}
})()
image.png
