JS之工廠模式
阿新 • • 發佈:2017-06-05
zhang 調用 round obj script 自己的 作用 div ()
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>工廠模式</title> 6 </head> 7 <body> 8 <script> 9 //讓我們決定通過廠長告訴做什麽事情,不需了解內部 10 /*模式作用: 11 1,對象的構建十分復雜,可以用此模式 12 2,需要依賴具體的環境創建不同的實例 13 3,處理大量具有相同屬性的小對象。14 註意事項: 15 1,不能濫用工廠,有時候是增加代碼增加復雜度 16 2, 17 18 */ 19 </script> 20 <script> 21 /* 實例一個簡單工廠 22 工廠應該有產長來決定運行哪些產品線 23 消費者 =》子類 24 25 */ 26 //gongchang 是一個單例牧師 27 var gongchang = {}; 28 gongchang.chanyifu =function(){ 29 this.gongren = 50; 30 // alert(‘我們有工人數‘+this.gongren);31 } 32 gongchang.chanxie = function(){ 33 alert(‘產鞋子‘) 34 } 35 gongchang.yunshu = function () { 36 alert(‘運輸‘) 37 } 38 gongchang.changzhang = function (para) { 39 //new JS 構造函數模式 單例模式 40 return new gongchang[para](); 41 } 42 var me = gongchang.changzhang(‘chanyifu‘); 43 alert(me.gongren); 44 </script> 45 <script> 46 /*簡單工廠 ajax*/ 47 //單例,XMLHttpFactory一個簡單工廠 48 var XMLHttpFactory = function(){}; 49 //工廠裏有createXMLHttp()方法 根據當前環境的具體情況返回一個XHR對象 50 XMLHttpFactory.createXMLHttp = function(){ 51 var XMLHttp = null; 52 if (window.XMLHttpRequest){ 53 XMLHttp = new XMLHttpRequest(); 54 } 55 else if(window.ActiveXObject){ 56 XMLHttp = new ActiveXObject(‘Microsoft.XMLHTTP‘) 57 } 58 return XMLHttp; 59 }; 60 var AjaxHander = function(){ 61 //最後生產到 我拿到的對象 不用管工廠裏做了什麽事, 62 var XMLHttp = XMLHttpFactory.createXMLHttp(); 63 //具體操作 64 } 65 </script> 66 <script> 67 /*以下是抽象復雜工廠*/ 68 var XMLHttpFactory = function(){}; 69 XMLHttpFactory.prototype = { 70 //調用這個的話 跑出一個錯誤,不能被實例化,只能用來派生子類 讓別的子類來繼承自己,然後做他們自己的事情 71 createFactory:function(){ 72 throw new Error(‘這是一錯誤‘) 73 } 74 }; 75 var XHRHander = function(){ 76 XMLHttpFactory.call(this); 77 }; 78 //將XMLHttpFactory的繼承到XHRHander 79 XHRHander.prototype = new XMLHttpFactory(); 80 //重新定義createFactory方法 81 XHRHander.prototype.constructor = XHRHander; 82 83 XHRHander.prototype.createFactory = function () { 84 var XMLHttp = null; 85 if (window.XMLHttpRequest){ 86 XMLHttp = new XMLHttpRequest() 87 } 88 else if(window.ActiveXObject){ 89 XMLHttp = new ActiveXObject(‘Microsoft.XMLHTTP‘) 90 } 91 return XMLHttp; 92 } 93 94 </script> 95 </body> 96 </html>
JS之工廠模式