溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了如何使用javascript中的建造者模式，內容清晰明了，對此有興趣的小伙伴可以學習一下，相信大家閱讀完之后會有幫助。
介紹：建造者模式又稱為生成器模式，它是一種較為復雜、使用頻率相對較低的創建型模式。建造者模式為客戶端返回的不是一個簡單的產品，而是一個由多個部件組成的復雜產品
定義：將一個復雜對象的構建與他的表示分離，使得同樣的構建過程可以創建不同的表示。建造者模式是一種對象創建型模式。
示例：
var Dialog = function (){
this.type = '';
this.name = '';
this.element = '';
this.show = function(){
console.log(this.name + ': ' + this.type + this.element);
}
}
var noticeBuilder = function(){
this.dialog = new Dialog();
this.setType = function(){
this.dialog.type = 'notice';
}
this.setName = function(){
this.dialog.name = '公告';
}
this.setElement = function(){
this.dialog.element = '<div>notice</div>';
}
this.getDialog = function(){
return this.dialog;
}
}
var toastBuilder = function(){
this.dialog = new Dialog();
this.setType = function(){
this.dialog.type = 'toast';
}
this.setName = function(){
this.dialog.name = '提示';
}
this.setElement = function(){
this.dialog.element = '<div>toast</div>';
}
this.getDialog = function(){
return this.dialog;
}
}
function construct(ab){
ab.setType();
ab.setName();
ab.setElement();
return ab.getDialog();
}
var notice = new noticeBuilder();
var toast = new toastBuilder();
var noticeIns = construct(notice);
var toastIns = construct(toast);
noticeIns.show(); //公告: notice<div>notice</div>
toastIns.show(); //提示: toast<div>toast</div>在建造者模式中，客戶端需要通過指揮類（construct方法）一步一步建造一個完整的產品，相同的構造過程可以創建完全不同的產品。
建造者模式可以將復雜對象的構建與其表示相分離，使用相同構建過程可以創建不同的表示層，用戶只需要指定需要建造的類型就可以，而具體的建造過程和細節就不需要知道了。
為了簡化系統結構，去掉construct參數，可以將construct合并到builder：
var Dialog = function (){
this.type = '';
this.name = '';
this.element = '';
this.show = function(){
console.log(this.name + ': ' + this.type + this.element);
}
}
var Construct = function(){
this.construct = function(){
this.setType();
this.setName();
this.setElement();
return this.getDialog();
}
}
var noticeBuilder = function(){
this.dialog = new Dialog();
this.setType = function(){
this.dialog.type = 'notice';
}
this.setName = function(){
this.dialog.name = '公告';
}
this.setElement = function(){
this.dialog.element = '<div>notice</div>';
}
this.getDialog = function(){
return this.dialog;
}
}
var toastBuilder = function(){
this.dialog = new Dialog();
this.setType = function(){
this.dialog.type = 'toast';
}
this.setName = function(){
this.dialog.name = '提示';
}
this.setElement = function(){
this.dialog.element = '<div>toast</div>';
}
this.getDialog = function(){
return this.dialog;
}
}
noticeBuilder.prototype = new Construct();
toastBuilder.prototype = new Construct();
var notice = new noticeBuilder();
var toast = new toastBuilder();
var noticeIns = notice.construct();
var toastIns = toast.construct();
noticeIns.show(); //公告: notice<div>notice</div>
toastIns.show(); //提示: toast<div>toast</div>建造者模式總結：
優點：
* 建造者模式中，客戶端不需要知道產品內部組成的細節，將產品使用與其創建解耦，使得相同創建過程可以創建不同的產品對象
* 每個具體的建造類都相對獨立，方便替換和新增，滿足開關原則
缺點：
* 建造者模式需要多個產品存在相同的創建流程，如果產品差異性大，就不適用建造者模式。
* 如果產品內部結構復雜多變，就需要定義很多建造類來實現這種變化，會導致系統變得龐大
看完上述內容，是不是對如何使用javascript中的建造者模式有進一步的了解，如果還想學習更多內容，歡迎關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
