JS工廠模式

maybe_009 發(fā)布于2019-08-21 10:49 / 2552人閱讀

摘要：工廠模式定義一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。如果不好理解，我們舉個實際一點的例子。假設(shè)我們要在一個頁面上插入一些元素，但這些元素不確定，可能是圖片，可能是鏈接，可能是文本。

工廠模式定義:一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。該模式使一個類的實例化延遲到了子類。而子類可以重寫接口方法以便創(chuàng)建的時候指定自己的對象類型。

看不懂？沒關(guān)系，先看看下面的例子。

var produceManager = {};
produceManager.createProduceA = function(){
    console.log("ProduceA");
}
produceManager.createProduceB = function(){
    console.log("ProduceB");
}
produceManager.factory = function(type){
    return new produceManager[type];
}
var produce = produceManager.factory("createProduceA");

如果不好理解，我們舉個實際一點的例子。假設(shè)我們要在一個頁面上插入一些元素，但這些元素不確定，可能是圖片，可能是鏈接，可能是文本。我們需要定義工廠類與子類（產(chǎn)品類）。

var page = page || {};
page.dom = page.dom || {};
//子函數(shù)：處理文本
page.dom.Text = function(){
    this.insert = function(where){
        var txt = document.createTextNode(this.url);
        where.appendChild(txt);
    };
};
//子函數(shù)：處理鏈接
page.dom.Link = function(){
    this.insert = function(where){
        var link = document.createElement("a");
        link.href = this.url;
        link.appendChild(document.createTextNode(this.url));
        where.appendChild(link);
    };
};
//子函數(shù)：處理圖片
page.dom.Image = function(){
    this.insert = function(where){
        var im = document.createElement("img");
        im.src = this.url;
        where.appendChild(im);
    };
};
//工廠
page.dom.factory = function(type){
    return new page.dom[type];
};

//test:
var o = page.dom.factory("Link");
o.url = "http://abc.com";
o.insert(document.body);

再讀讀這句話：工廠模式定義一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。該模式使一個類的實例化延遲到了子類。而子類可以重寫接口方法以便創(chuàng)建的時候指定自己的對象類型。

這下是不是清楚多了，還不懂，沒關(guān)系，多敲幾遍，多看幾遍，就懂了。

GPU云服務(wù)器云服務(wù)器工廠模式工廠方法模式抽象工廠模式代碼設(shè)計模式工廠模式

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/86254.html

相關(guān)文章

JS 設(shè)計模式六（工廠模式）

摘要：首先吧之前的代碼打包成一個新的設(shè)計模式公用代碼工廠模式要點工廠接口是工廠方法模式的核心，與調(diào)用者直接交互用來提供產(chǎn)品。適用場景在任何需要生成復(fù)雜對象的地方，都可以使用工廠方法模式。工廠模式之前講了接口，封裝，繼承，單例等，現(xiàn)在就需要應(yīng)用這些特性來完成一些設(shè)計模式了。首先吧之前的代碼打包成一個新的JS DesignPattern.js // 設(shè)計模式公用代碼 exports...

raoyi 2019-08-19 18:19 評論0 收藏0
JS 工廠模式

摘要：工廠模式定義一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。實現(xiàn)一個簡單的實現(xiàn)，使用如果使用對象屬性來實現(xiàn)以下例子中的工廠方法接受在運行時以字符串形式指定的類型，然后創(chuàng)建并返回所請求類型的對象。 1. 簡介工廠模式的目的是為了創(chuàng)建對象，它通常在類或者類的靜態(tài)方法中實現(xiàn)，具有以下目標(biāo)：當(dāng)創(chuàng)建相似對象時執(zhí)行重復(fù)操作當(dāng)編譯時不知道具體類型的情況下，為工廠客戶提供一個創(chuàng)建對象...

zhangke3016 2019-08-22 11:17 評論0 收藏0
一天一個設(shè)計模式之JS實現(xiàn)——工廠模式

摘要：參考文章深入理解三種工廠模式工廠模式，工廠方法模式，抽象工廠模式詳解工廠模式是中最常用的設(shè)計模式之一。這種類型的設(shè)計模式屬于創(chuàng)建型模式，它提供了一種創(chuàng)建對象的最佳方式。參考文章：深入理解java三種工廠模式工廠模式，工廠方法模式，抽象工廠模式詳解工廠模式（Factory Pattern）是 Java 中最常用的設(shè)計模式之一。這種類型的設(shè)計模式屬于創(chuàng)建型模式，它提供了一種創(chuàng)建對象的...

Muninn 2019-08-22 15:54 評論0 收藏0
JS 抽象工廠模式

摘要：簡介抽象工廠模式就是通過類的抽象使得業(yè)務(wù)適用于一個產(chǎn)品類簇的創(chuàng)建，而不負(fù)責(zé)某一類產(chǎn)品的實例。通過抽象工廠，就可以創(chuàng)建某個類簇的產(chǎn)品，并且也可以通過來檢查產(chǎn)品的類別，也具備該類簇所必備的方法。 0. 簡介抽象工廠模式(Abstract Factory)就是通過類的抽象使得業(yè)務(wù)適用于一個產(chǎn)品類簇的創(chuàng)建，而不負(fù)責(zé)某一類產(chǎn)品的實例。 JS中是沒有直接的抽象類的，abstract是個保留字，但...

RiverLi 2019-08-22 11:17 評論0 收藏0
JS 設(shè)計模式七（抽象工廠模式）

摘要：抽象工廠模式抽象工廠是工廠模式的升級版，他用來創(chuàng)建一組相關(guān)或者相互依賴的對象。代碼抽象工廠模式抽象工廠的優(yōu)點抽象工廠模式除了具有工廠方法模式的優(yōu)點外，最主要的優(yōu)點就是可以在類的內(nèi)部對產(chǎn)品族進行約束。抽象工廠模式抽象工廠是工廠模式的升級版，他用來創(chuàng)建一組相關(guān)或者相互依賴的對象。上節(jié)學(xué)習(xí)了工廠模式，類的創(chuàng)建依賴工廠類，程序需要擴展時，我們必須創(chuàng)建新的工廠類。工廠類是用來生產(chǎn)產(chǎn)品的，那我...

FuisonDesign 2019-08-19 18:20 評論0 收藏0
js常用設(shè)計模式實現(xiàn)（二）工廠模式和抽象工廠模式

摘要：抽象工廠模式可以向客戶端提供一個接口，使客戶端在不必指定產(chǎn)品的具體的情況下，創(chuàng)建多個產(chǎn)品族中的產(chǎn)品對象。前邊的兩個都是直接生產(chǎn)實例的，開始以為抽象工廠也是但是后來發(fā)現(xiàn)抽象工廠更像是生產(chǎn)工廠，其實抽象工廠其實是實現(xiàn)子類繼承父類的方法。創(chuàng)建型模式創(chuàng)建型模式是對一個類的實例化過程進行了抽象，把對象的創(chuàng)建和對象的使用進行了分離上一篇介紹了下單例模式，這一篇介紹一下工廠模式和抽象工廠模式，...

meteor199 2019-08-23 18:37 評論0 收藏0