js設計模式第六章 分既是合——建造者模式 讀書筆記
阿新 • • 發佈:2018-12-03
建造者模式:將一個複雜物件的構建層與其表示層相互分離,同樣的構建過程可採用不同的表示。
工廠模式主要是為了建立物件例項或者類簇,關心的是最終產出的是什麼。不關心你建立的整個過程,僅僅需要知道最終建立的結果。所以通過工廠模式我們得到的都是物件例項或者類簇。
然而建造者模式在建立物件是更為複雜一些,雖然其目的也是為了建立物件,但他更多關心的是建立這個物件的整個過程,甚至於建立物件的每一個細節。
比如一個招聘平臺,使用者建立簡歷,會有姓名、職業、興趣愛好等等,為了更好管理分類,可以建立使用者類、姓名類、職業類
//建立一位人類 var Human = function( param ){ //技能 this.skill = param && param.skill || "保密"; //愛好 this.hobby = param && param.hobby || "保密"; }; //人類原型方法 Human.prototype = { getSkill: function(){ return this.skill; }, getHobby: function(){ return this.hobby; } }; //例項化姓名類 var Named = function( name ){ //姓 this.firstName = ""; //名 this.lastName = ""; var _this = this; //函式自呼叫解析姓名的姓與名 ( function(){ if( name.indexOf(" ") > -1 ){ _this.firstName = name.slice( 0, name.indexOf( " " ) ); _this.lastName = name.slice( name.indexOf( " " ) ); } } )() }; //例項化職位物件 var Work = function( work ){ this.work = ""; this.workDescript = ""; var _this = this; //函式自呼叫通過傳入的職位特徵來設定相應職位以及描述 ( function(){ switch( work ){ case "code": _this.work = "工程師"; _this.workDescript = "每天沉醉於程式設計"; break; case "UI": case "UE": _this.work = "設計師"; _this.workDescript = "設計更似一種藝術"; break; case "teach": _this.work = "教師"; _this.workDescript = "分享也是一種快樂"; break; default: _this.work = work; _this.workDescript = "對不起,我們還不清楚您所選的職位的相關描述"; } } )() }; //更換期望的職位 Work.prototype.changeWork = function( work ){ this.work = work; }; //新增對職位的描述 Work.prototype.changeDescript = function( sentence){ this.workDescript = sentence; };
這幾個類之間看起來並有沒有什麼聯絡,這就可以看做成一些製造一個玩具的零件,在組裝之前必須先要把他們做好,這個過程是必不可少的。建造者模式注重的也正是建造的這個過程。接下來我們就需要開始組裝。來構建一個應聘者類
var Person = function( name, work ){ //建立應聘這快取物件 var _person = new Human(); //應聘者姓名解析 _person.name = new Named( name ); //建立應聘這職位期望 _person.work = new Work( work ); //將應聘物件返回 return _person; }; var person = new Person( "tao wj", "code" ); console.log( person.name.firstName ); console.log( person.skill ); console.log( person.work.work ); console.log( person.work.workDescript ); person.work.changeDescript( "更改一下職位描述" ); console.log( person.work.workDescript);