JavaScript設計模式系列三：建造者模式

來源：懂視網責編：小采時間：2020-11-27 19:57:05

JavaScript設計模式系列三：建造者模式

JavaScript設計模式系列三：建造者模式:本篇文章給大家分享的是JavaScript設計模式系列三：建造者模式，有感興趣的朋友可以看一下建造者模式建造者模式（builder pattern）比較簡單，它屬于創建型模式的一種，將一個復雜的對象分解成多個簡單的對象來進行構建，將復雜的構建層與表示層分離，使得相

推薦度：

點擊下載本文 文檔為doc格式

導讀JavaScript設計模式系列三：建造者模式:本篇文章給大家分享的是JavaScript設計模式系列三：建造者模式，有感興趣的朋友可以看一下建造者模式建造者模式（builder pattern）比較簡單，它屬于創建型模式的一種，將一個復雜的對象分解成多個簡單的對象來進行構建，將復雜的構建層與表示層分離，使得相

本篇文章給大家分享的是JavaScript設計模式系列三：建造者模式，有感興趣的朋友可以看一下

建造者模式

建造者模式（builder pattern）比較簡單，它屬于創建型模式的一種，將一個復雜的對象分解成多個簡單的對象來進行構建，將復雜的構建層與表示層分離，使得相同的構建過程可以創建不同的表示的模式便是建造者模式。

優點

建造者模式的封裝性很好，對象本身與構建過程解耦。

建造者模式很容易進行擴展。如果有新的需求，通過實現一個新的建造者類就可以完成。

適用場景

需要生成的對象具有復雜得內部結構；且內部屬性本身相互依賴

建造者模式的代碼實現

建造者模式主要有4個部分：product產品類、Builder建造者類、Director指揮者類、客戶。

主要的流程是：

客戶提出需求。
指揮者根據用戶需求，指揮建造者去完成需求的各個部分。
建造者完成相應的部分。

我們來看一下相應的代碼：
產品類為一輛加工的空殼汽車。

/**
 * 產品類：car 目前需要構建一輛車。
 */

function car () {
 this.name = '',
 this.number = '',
 this.wheel = '',
 this.engine = ''
}

接下來看一下建造者類：

/* 
* 建造者類，里面有專門負責各個部分的工人
*/
function carBuilder () {
 this.nameBuilder = function () {
 this.name = '很厲害的車'
 },
 this.numberBuilder = function () {
 this.number = '88888888'
 },
 this.wheelBuilder = function () {
 this.wheel = '高級橡膠做的輪子'
 },
 this.engineBuilder = function () {
 this.engine = '很厲害的引擎'
 },
 this.getCar = function () {
 var Car = new car()
 Car.name = this.name;
 Car.number= this.number;
 Car.wheel = this.wheel;
 Car.engine = this.engine;
 return Car;
 }
}

再這里我們可以看到各個部分的工人以及他們的工作，他們的各自的工作最終合并成一輛汽車。

指揮者類：

/**
 * 指揮者類，指揮各個部分的工人工作
 */
function director () {
 this.action = function (builder) {
 builder.nameBuilder();
 builder.numberBuilder();
 builder.wheelBuilder();
 builder.engineBuilder();
 } 
}

最后就是使用方法：

/**
 * 使用方法
 */

var builder = new carBuilder();
var director = new director();
director.action(builder);
var Car = builder.getCar();
console.log(Car);

最終客戶通過getCar方法得到了這輛車，并且不需要知道其中得建造細節。