模块模式 用于简单的封装,只暴露出几个接口
var Person =(function(){
var name = 'Zzzoe'
function sayName(){
console.log(name)
}
return {
name: name,
sayName: sayName
}
})()
Person.sayName() //Zzzoe
console.log(Person.name)
构造函数模式 较复杂的组件
function Person (name, age){
this.name = name
this.age = age
}
//在原型上添加方法
Person.prototype.sayName = function(){
console.log(this.name)
}
Person.prototype.sayAge = function(){
console.log(this.age)
}
var girl = new Person('zoe','22')
girl.sayName() //zoe
girl.sayAge() //22
混合模式
function Person (name, age){
this.name = name
this.age = age
}
Person.prototype.sayName = function(){
console.log(this.name)
}
Person.prototype.sayAge = function(){
console.log(this.age)
}
Girl = function(name, age, height){
Person.call(this,name, age)
this.height = height
}
Girl.prototype = Object.create(Person.prototype)
Girl.prototype.sayHeight = function(){
console.log(this.height)
}
var girl = new Girl('zoe','22','162')
girl.sayName()
girl.sayAge()
girl.sayHeight()
工厂模式 用于:简单的创建对象
function creatPerson(opts){
var person = {
name: opts.name || 'zoe'
}
person.sayName = function(){
console.log(this.name)
}
return person
}
var a = creatPerson({name: 'lalala'})
var b = creatPerson({name: 'ppppp'})
a.sayName()
b.sayName()
单例模式
var People = (function(){
var instance
function init(){
//do something
return {}
}
return {
createPeople: function(){
if(!instance){
instance = init()
}
return instance
}
}
}())
var obj1 = People.createPeople()
var obj2 = People.createPeople()
发布订阅模式
var Event = (function(){
var events = {}
function on(evt, handler){
events[evt] = events[evt] || []
events[evt].push({
handler: handler
})
console.log(events)
}
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){
events[evt] = []
}
return {
on: on,
fire: fire,
off: off
}
})()
Event.on('change', function(data){
console.log('change... now val is ' + data)
})
Event.fire('change', '饥人谷')
Event.off('change')