搜尋
首頁web前端js教程Javascript設計模式理論與程式設計實戰之簡單工廠模式_javascript技巧

閱讀目錄

基本介紹
舉例說明
總結說明

簡單工廠模式是由一個方法來決定到底要創建哪個類的實例, 而這些實例經常都擁有相同的接口. 這種模式主要用在所實例化的類型在編譯期並不能確定, 而是在執行期決定的情況。 說的通俗點,就像公司茶水間的飲料機,要咖啡還是牛奶取決於你按哪個按鈕。

簡單工廠模式在創建ajax物件的時候也非常有用.

通常我們建立物件最常規的方法就是使用new關鍵字呼叫建構函數,這會導致物件之間的依賴性。工廠模式是一種有助於消除類別之間依賴性的設計模式,它使用一個方法來決定要實例化哪個類別。本文詳細介紹了簡單工廠模式的理論,並舉例說明了簡單工廠模式的具體應用。

基本介紹

簡單工廠模式是工廠模式中最基本的一種。透過定義一個工廠類,根據參數實例化具體的某個產品類。

舉例說明

我們舉個例子來說明:假設我們開發一個旅遊業網站,網站上面銷售機票,飯店等產品。一個用戶準備購買一張機票。我們可以定義相關類別如下:

 var productEnums = {
   flight: "flight",
   hotel: "hotel"
 };
 function Flight() {
   console.log("This is Flight");
 }
 function Hotel() {
   console.log("This is Hotel");
 }
 function User() {
   this.shopCart = [];
 }
 User.prototype = {
   constructor: User,
   order: function (productType) {
     var product = null;
     switch (productType) {
       case productEnums.flight:
         product = new Flight();
       case productEnums.hotel:
         product = new Hotel();
       default:
     }
     this.shopCart.push(product);
   }
 }
 var user = new User();
 user.order(productEnums.flight);

這段程式碼定義了三個類別:使用者類別User,機票類別Flight,飯店類別Hotel,其中User包含預訂方法。用戶預訂的時候直接傳入產品類型即可。這段程式碼乍看之下沒什麼問題,但是需求和業務是隨時變化的,如果公司業務擴展,增加了簽證業務,我們就要去修改User類來保證它支援簽證。我們當然可以這麼做,但直接去修改User類別有什麼不好呢,有沒有更好的方法呢?

首先要說的是User類,這個類是表示用戶類,而用戶類本質上跟具體的某一類業務是無關的,也就是說,業務有可能隨時增加,但是用戶關於業務方面的代碼也就是創建產品訂單。新增的簽證業務本質上和已經存在的機票和酒店沒有什麼區別,如果每增加一種業務就要去修改User類,這對代碼的穩定性和可維護性大大的不好,更好的解決方法是有一個專門的創建訂單的類別在管理不同的業務,這個類別就是簡單工廠。

我們修改程式碼如下:

var productFactory = (function () {
   var productFactories = {
     "flight": function () {
       return new Flight();
     },
     "hotel": function () {
       return new Hotel();
     }
   };
   return {
     createProduct: function (productType) {
       return productFactories[productType]();
     }
   }
 })();
 User.prototype = {
   constructor: User,
   order: function (productType) {
     this.shopCart.push(productFactory.createProduct(productType));
   }
 }

這段程式碼主要修改的地方有兩點:

(1)增加了一個產品工廠,根據不同的產品類型返回不同的物件

(2)修改User類別的order方法為呼叫工廠類別中的建立產品方法。

這樣做的好處是:

(1)讓User的order方法更專注,只做預訂產品這項功能,而提取創建產品訂單到專門的工廠類別中,程式碼更簡潔清晰

(2)一個專門管理product的factory,增加新產品很容易,不用再去修改User類別

總結說明

簡單工廠模式的主要特點是將物件的創建和使用進行了分離,主要有3個部分組成:

1.物件使用類,該類是被工廠創造出來的使用者,與物件的種類和創建過程無關

2.工廠類,工廠類根據傳入的參數創建不同的對象並返回給對象使用類,包含了不同對象的創建過程,如果有不同的對象,則要修改該類

3.物件類,不同業務產生的不同類,就是工廠生產的產品

簡單工廠模式優點

1.工廠類別集中了所有物件的創建,便於物件創建的統一管理

2.對象的使用者只是使用產品,實現了單一職責

3.便於擴展,如果新增了一種業務,只需要增加相關的業務物件類別和工廠類別中的生產業務物件的方法,不需要修改其他的地方。

適用場景

1.需要根據不同參數產生不同實例,這些實例有一些共通點的場景

2.使用者只需要使用產品,不需要知道產品的創建細節

注意:除非是適用場景,否則不可濫用工廠模式,會造成程式碼的複雜度。

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
在JavaScript中替換字符串字符在JavaScript中替換字符串字符Mar 11, 2025 am 12:07 AM

JavaScript字符串替換方法詳解及常見問題解答 本文將探討兩種在JavaScript中替換字符串字符的方法:在JavaScript代碼內部替換和在網頁HTML內部替換。 在JavaScript代碼內部替換字符串 最直接的方法是使用replace()方法: str = str.replace("find","replace"); 該方法僅替換第一個匹配項。要替換所有匹配項,需使用正則表達式並添加全局標誌g: str = str.replace(/fi

如何創建和發布自己的JavaScript庫?如何創建和發布自己的JavaScript庫?Mar 18, 2025 pm 03:12 PM

文章討論了創建,發布和維護JavaScript庫,專注於計劃,開發,測試,文檔和促銷策略。

如何在瀏覽器中優化JavaScript代碼以進行性能?如何在瀏覽器中優化JavaScript代碼以進行性能?Mar 18, 2025 pm 03:14 PM

本文討論了在瀏覽器中優化JavaScript性能的策略,重點是減少執行時間並最大程度地減少對頁面負載速度的影響。

jQuery矩陣效果jQuery矩陣效果Mar 10, 2025 am 12:52 AM

將矩陣電影特效帶入你的網頁!這是一個基於著名電影《黑客帝國》的酷炫jQuery插件。該插件模擬了電影中經典的綠色字符特效,只需選擇一張圖片,插件就會將其轉換為充滿數字字符的矩陣風格畫面。快來試試吧,非常有趣! 工作原理 插件將圖片加載到畫布上,讀取像素和顏色值: data = ctx.getImageData(x, y, settings.grainSize, settings.grainSize).data 插件巧妙地讀取圖片的矩形區域,並利用jQuery計算每個區域的平均顏色。然後,使用

如何使用瀏覽器開發人員工具有效調試JavaScript代碼?如何使用瀏覽器開發人員工具有效調試JavaScript代碼?Mar 18, 2025 pm 03:16 PM

本文討論了使用瀏覽器開發人員工具的有效JavaScript調試,專注於設置斷點,使用控制台和分析性能。

如何構建簡單的jQuery滑塊如何構建簡單的jQuery滑塊Mar 11, 2025 am 12:19 AM

本文將引導您使用jQuery庫創建一個簡單的圖片輪播。我們將使用bxSlider庫,它基於jQuery構建,並提供許多配置選項來設置輪播。 如今,圖片輪播已成為網站必備功能——一圖胜千言! 決定使用圖片輪播後,下一個問題是如何創建它。首先,您需要收集高質量、高分辨率的圖片。 接下來,您需要使用HTML和一些JavaScript代碼來創建圖片輪播。網絡上有很多庫可以幫助您以不同的方式創建輪播。我們將使用開源的bxSlider庫。 bxSlider庫支持響應式設計,因此使用此庫構建的輪播可以適應任何

用JavaScript增強結構標記用JavaScript增強結構標記Mar 10, 2025 am 12:18 AM

核心要点 利用 JavaScript 增强结构化标记可以显著提升网页内容的可访问性和可维护性,同时减小文件大小。 JavaScript 可有效地用于为 HTML 元素动态添加功能,例如使用 cite 属性自动在块引用中插入引用链接。 将 JavaScript 与结构化标记集成,可以创建动态用户界面,例如无需页面刷新的选项卡面板。 确保 JavaScript 增强功能不会妨碍网页的基本功能至关重要;即使禁用 JavaScript,页面也应保持功能正常。 可以使用高级 JavaScript 技术(

如何使用Angular上傳和下載CSV文件如何使用Angular上傳和下載CSV文件Mar 10, 2025 am 01:01 AM

數據集對於構建API模型和各種業務流程至關重要。這就是為什麼導入和導出CSV是經常需要的功能。在本教程中,您將學習如何在Angular中下載和導入CSV文件

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

WebStorm Mac版

WebStorm Mac版

好用的JavaScript開發工具

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器