問(wèn)答

1.寫(xiě)出構(gòu)造函數(shù)模式、混合模式、模塊模式、工廠模式、單例模式、發(fā)布訂閱模式的范例。

• 工廠模式，想造什么造什么，缺點(diǎn)代碼重復(fù)創(chuàng)造共有屬性。
  function createPerson(args){
  var person= {
  name:args.name || 'ruoyu',
  age:args.age || 20
  };
  person.sayName= function(){
  console.log('my name is '+this.name)
  }
  return person;
  }
  var person1= createPerson({name:'hunger',age:2})
  var person2= createPerson({age:20})
  person1=== person2//false

• 構(gòu)造函數(shù)模式，我比工廠模式牛，兩大工具強(qiáng)化我，原型共享方法，new來(lái)實(shí)例化
  function Person(name,age){
  this.name = name;
  this.age = age;
  }
  Person.prototype.sayName=function(){
  return ('my name is '+this.name)
  }
  var p1=new Person('ruoyu',30);
  var p2=new Person('hunger',20);
  p1===p2//false

• 混合模式，工廠構(gòu)造我都有，中介函數(shù)來(lái)搭橋

      //混合模式
    var Person=function(name,age){
        this.name=name;
        this.age= age 
    }
    Person.prototype.sayName=function(){
        return ('my name is '+this.name)
    }
    var Student=function(name,age,score){
        Person.call(this,name,age);
        this.score=score;
    }
    //中介函數(shù)過(guò)渡原型鏈
    Student.prototype=create(Person.prototype);
    function create(parentObj){
        function F(){};
        F.prototype=parentObj;
        return new F();
    }
    Student.prototype.sayScore=function(){
        return (this.name+'的得分是'+this.score)
    }
    var student1= new Student('hunger',20,80);
    var student2= new Student('ruoyu',20,80);
  

• 模塊模式，我的安全系數(shù)高，內(nèi)部東西看不到，非要強(qiáng)來(lái)調(diào)用我，return接口給你使。
  模塊模式
  var Person = (function(){
  var name='bush';
  return　{
  sayName:function(){
  return name;
  },
  sayAge:function(age){
  return (name+' is '+age+' old')
  },
  changeName:function(newName){
  name=newName
  }
  }
  })()
  Person.sayName();
  Person.changeName('rouyu');
  Person.sayAge(20);

• 單例模式，顧名思義，不論你new多少次，永遠(yuǎn)都是一個(gè)我（person1 === person2;//true）
  單例模式
  var Person=(function(){
  function Person(args){
  var args= args || {};
  this.name=args.name || "Tom";
  this.sex= args.sex || 'man';
  }
  var instance;
  return {
  //把函數(shù)容器new 生成一個(gè)實(shí)例，實(shí)例存在就不生成
  getInstance:function(args){
  if(!instance){
  instance= new Person(args);
  }
  return instance;
  }
  }
  })()
  //通過(guò)函數(shù)的相同方法的參數(shù)內(nèi)容不同生成不同對(duì)象;
  var person1=Person.getInstance({name:'dota',sex:'man'});
  var person2=Person.getInstance({name:'xiao'});
  person1 === person2;//true

• 發(fā)布訂閱模式，我的名字最奇怪，我把組件來(lái)分解，一步綁定（on），一步調(diào)用(fire),一步解綁（off）,多種玩法任你選

  var EventCenter=(function(){
        var events={};
        function fire(evt,args){
            if(!events[evt]){
                return;
            };
            for(var i=0;i<events[evt].length;i++){
            //只能調(diào)用一個(gè)參數(shù)
            // events[evt][i].handler(args)
            //調(diào)用多個(gè)參數(shù),args是類數(shù)組
            events[evt][i].handler([].slice.call(arguments,1))
            }
        }
        function on(evt,handler1){
            events[evt]=events[evt]||[];
            events[evt].push({
                handler:handler1
            })
        }
        function off(evt){
            if(events[evt]){
                delete events[evt]
            }
        }
        return {
            on:on,
            fire:fire,
            off:off
        }
    })()
    EventCenter.on('roll', function () {
        console.log("you are roll now!!!")
    })
  

2.使用發(fā)布訂閱模式寫(xiě)一個(gè)事件管理器，可以實(shí)現(xiàn)如下方式調(diào)用

      var EventManager=(function(){
        var events={};
        function fire(evt){
            if(!events[evt]){
                console.log('沒(méi)有綁定')
                return
            };
            for(var i=0;i<events[evt].length;i++){
                events[evt][i]([].slice.call(arguments,1))
            }
        }
        function on(evt,fun){
            events[evt]=events[evt]||[];
            events[evt].push(fun);
        }
        function off(evt){
            delete events[evt];
        }
        return {
            on:on,
            fire:fire,
            off:off
        }
    })()
    EventManager.on('text:change', function(val){
        console.log('text:change...  now val is ' + val); //綁定了 
    });
    EventManager.fire('text:change', '饑人谷');//輸出內(nèi)容text:change...  now val is 饑人谷
    EventManager.off('text:change');//解綁定
    EventManager.fire('text:change', 'jirengu');//沒(méi)有綁定

代碼題

1.寫(xiě)一個(gè)函數(shù)createTimer，用于創(chuàng)建計(jì)時(shí)器，創(chuàng)建的計(jì)時(shí)器可分別進(jìn)行計(jì)時(shí)「新增」。
代碼
2.封裝一個(gè)曝光加載組件，能實(shí)現(xiàn)如下方式調(diào)用
代碼預(yù)覽
3.封裝一個(gè) 輪播插件，分別使用對(duì)象方式和 jquery插件方式來(lái)調(diào)用
對(duì)象方式
jQuery插件