1.寫出 構(gòu)造函數(shù)模式泣洞、混合模式、模塊模式默色、工廠模式球凰、單例模式、發(fā)布訂閱模式的范例腿宰。
構(gòu)造函數(shù)胡模式(constructor)
構(gòu)造函數(shù)用于創(chuàng)建特定類型的對象-不僅聲明了使用的對象呕诉,還可以接收參數(shù)以便第一次創(chuàng)建對象的時候設(shè)置對象的成員值。通過new關(guān)鍵字來調(diào)用自定義的構(gòu)造函數(shù)吃度,在構(gòu)造函數(shù)內(nèi)部甩挫,this關(guān)鍵字引用的是新創(chuàng)建的對象。
function Person(name,age){
this.name = name
this.age = age
}
Person.prototype = {
sayName:function(){
return this.name
},
showAge:function(){
return this.age
}
}
var student = new Person('小明',15)
student.sayName()
student.showAge()
工廠模式(factory)
解決多個類似對象聲明的問題;也就是為了解決實列化對象產(chǎn)生重復(fù)的問題椿每。
function createPerson(name){
var person = {
name: name,
sayName:function(){
console.log(this.name)
}
}
return person
}
createPerson('小明').sayName()
模塊模式(module)
模塊模式使用了一個返回對象的匿名函數(shù)伊者。在這個匿名函數(shù)內(nèi)部,先定義了私有變量和函數(shù)间护,供內(nèi)部函數(shù)使用亦渗,然后將一個對象字面量作為函數(shù)的值返回,返回的對象字面量中只包含可以公開的屬性和方法汁尺。這樣的話央碟,可以提供外部使用該方法;由于該返回對象中的公有方法是在匿名函數(shù)內(nèi)部定義的均函,因此它可以訪問內(nèi)部的私有變量和函數(shù)亿虽。
var Person = (function(){
var name = 'xiaoming'
function sayName(){
console.log(name)
}
return {
name:name,
sayName:sayName
}
})()
混合模式(mixin)
實現(xiàn)原型繼承,通過一個構(gòu)造函數(shù)來定義屬性苞也,把共享的方法定義在原型鏈上洛勉,減少系統(tǒng)中的重復(fù)功能及增加函數(shù)復(fù)用
function Person(name, sex){
this.name = name;
this.sex = sex;
}
Person.prototype.getName = function(){
console.log(this.name)
};
function Male(name, sex, age){
Person.call(this,name, sex);
this.age = age;
}
var _prototype = Object.create(Person.prototype);
// _prototype.constructor = Male;
Male.prototype = _prototype;
Male.prototype.getAge = function(){
console.log(this.age)
};
var student = new Male('小明', '男', 15);
student.getName();
單例模式(singleton)
保證一個類只有一個實例,實現(xiàn)的方法一般是先判斷實例存在與否如迟,如果存在則直接返回收毫,如果不存在就創(chuàng)建了再返回,這就確保了一個類只有一個實例對象殷勘。在JavaScript中此再,單例作為一個命名空間提供者,從全局命名空間里提供一個唯一的訪問點來訪問該對象玲销。
js的作用域體現(xiàn)在函數(shù)中输拇,外界不能訪問到函數(shù)內(nèi)部的變量;
函數(shù)能訪問的上下文作用域是它定義的位置所決定贤斜;
閉包:隱藏函數(shù)內(nèi)部的變量策吠,存儲一個變量
var Person =(function(){
var instance
function init(name){
return {
name:name
};
}
return {
createPerson: function(name){
if(!instance){
instance = init(name)
}
return instance
}
}
})();
Person.createPerson('student') //{name:student}
Person.createPerson('teacher') //{name:student} 把原來的引用給拿出來
發(fā)布訂閱模式(pubish/subsciibe)
定義對象間的一種一對多的依賴關(guān)系逛裤,當(dāng)一個對象的狀態(tài)發(fā)生改變時,所有依賴于它的對象都將得到通知猴抹。對外導(dǎo)出的Api是on,fire,off
var EventCenter = (function(){
var events = {}; //存儲所有數(shù)據(jù)
function on(evt,handler){
//一開始events[evt] = []空數(shù)組
events[evt] = events[evt] || [];
//把handler添加到數(shù)組带族,handler為函數(shù)
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(name){
delete events[name]
}
return {
on:on,
fire:fire,
off:off
}
})()
2.使用發(fā)布訂閱模式寫一個事件管理器,可以實現(xiàn)如下方式調(diào)用
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<events[evt].length; i++){
events[evt][i].handler(args)
}
}
function off(evt){
delete events[evt]
}
return {
on:on,
fire:fire,
off:off
}
})()
Event.on('change', function(val){
console.log('change... now val is ' + val);
});
Event.fire('change', '饑人谷');
Event.off('change');