前端設計模式

1.寫出 構造函數模式、混合模式、模塊模式、工廠模式、單例模式、發布訂閱模式的范例。

構造函數模式

var Fn = function(){
    this.a = 1;
    this.b = 2
}
Fn.prototype.init = function(){
    console.log("ok")
}
var a = new Fn;
console.log(a.init());// "ok"

混合模式

var Fn = function(){
    this.a = 1;
    this.b = 2;
    this.init()
}
Fn.prototype.init = function(){
    console.log("ok")
}
var Son = function(){}
Son.prototype=Object.creat(Fn.prototype);
Son.prototype.construct = Son

模塊模式

var module = (function(){
    var name = "xiaowang"
    var Fn = function(){
    this.a = 1;
    this.b = 2;
    this.init()
    }
    Fn.prototype.init = function(){
    console.log("ok")
    }
    return {
        init: Fn;
        name: name
    }
})()

工廠模式

function create( opts ){
    var person ={
         name: opts.name || 'hunger',
    };
    person.sayName: function(){
        console.log(this.name)
    }
    return person
}
var p1 = create( { name: "xiaoming" } );
var p1 = create( { name: "xiaowang" } );

單例模式

var people = (function () {
    var instance;
    function init() {
      return {  
      };
  }
    return {
      creat: function () {
        if(!instance){
          instance = init()
        }
        return instance;
      }
    };
})()

發布訂閱模式

  var event = {};
  function on( evt, handle){
    evevt[evt] = evevt[evt] || [];
    evevt[evt].push({
      handler: handle
    })
  }
  function fire( evt, args){
    if( !evevt[evt] ){
      return
    }
    for( var i = 0; i<evevt[evt].length; i++){
      evevt[evt][i].handler(args)
    }
  }
  function off(n){
    delete enent[n];
  }
  return {
    on: on,
    fire: fire,
    off: off
  }
})()
EventCenter.on( "change", function(val){
  console.log("change...  now val is"+val)
});
EventCenter.fire("change","jirengu");
EventCenter.off("change");```
第二題參上
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 單例模式 適用場景:可能會在場景中使用到對象,但只有一個實例,加載時并不主動創建,需要時才創建 最常見的單例模式,...
    Obeing閱讀 2,102評論 1 10
  • 工廠模式類似于現實生活中的工廠可以產生大量相似的商品,去做同樣的事情,實現同樣的效果;這時候需要使用工廠模式。簡單...
    舟漁行舟閱讀 7,827評論 2 17
  • 1. 寫出 構造函數模式、混合模式、模塊模式、工廠模式、單例模式、發布訂閱模式的范例。 模塊模式var Perso...
    _李祺閱讀 274評論 0 0
  • 一、構造函數模式、混合模式、模塊模式、工廠模式、單例模式、發布訂閱模式的范例 單例模式單例就是保證一個類只有一個實...
    任少鵬閱讀 392評論 0 0
  • 寫出 構造函數模式、混合模式、模塊模式、工廠模式、單例模式、發布訂閱模式的范例。 使用發布訂閱模式寫一個事件管理器...
    coolheadedY閱讀 358評論 0 0