本文實例講述了JavaScript設(shè)計模式之模板方法模式原理與用法。分享給大家供大家參考,具體如下:
成都創(chuàng)新互聯(lián)公司堅信:善待客戶,將會成為終身客戶。我們能堅持多年,是因為我們一直可值得信賴。我們從不忽悠初訪客戶,我們用心做好本職工作,不忘初心,方得始終。十多年網(wǎng)站建設(shè)經(jīng)驗成都創(chuàng)新互聯(lián)公司是成都老牌網(wǎng)站營銷服務(wù)商,為您提供成都網(wǎng)站設(shè)計、成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計、H5響應(yīng)式網(wǎng)站、網(wǎng)站制作、品牌網(wǎng)站設(shè)計、小程序開發(fā)服務(wù),給眾多知名企業(yè)提供過好品質(zhì)的建站服務(wù)。
一、模板方法模式:一種只需使用繼承就可以實現(xiàn)的非常簡單的模式。
二、模板方法模式由兩部分組成,第一部分是抽象父類,第二部分是具體的實現(xiàn)子類。
三、以設(shè)計模式中的Coffee or Tea來說明模板方法模式:
1、模板Brverage,代碼如下:
var Beverage = function(){}; Beverage.prototype.boilWater = function(){ console.log('把水煮沸'); }; Beverage.prototype.pourInCup = function(){ throw new Error( '子類必須重寫pourInCup' ); }; Beverage.prototype.addCondiments = function(){ throw new Error( '子類必須重寫addCondiments方法' ); }; Beverage.prototype.customerWantsConditions = function(){ return true; //默認需要調(diào)料 }; Beverage.prototype.init = function(){ this.boilWater(); this.brew(); this.pourInCup(); if(this.customerWantsCondiments()){ //如果掛鉤返回true,則需要調(diào)料 this.addCondiments(); } };
2、子類繼承父類
var CoffeeWithHook = function(){}; CoffeeWithHook.prototype = new Beverage(); CoffeeWithHook.prototype.brew = function(){ console.log('把咖啡倒進杯子'); }; CoffeeWithHook.prototype.addCondiments = function(){ console.log('加糖和牛奶'); }; CoffeeWithHook.prototype.customerWantsCondiments = function(){ return window.confirm( '請問需要調(diào)料嗎?' ); };
3、煮一杯咖啡
var coffeeWithHook = new CoffeeWithHook(); coffeeWithHook.init();
四、另一種寫法
var Beverage = function( param ){ var boilWater = function(){ console.log( '把水煮沸' ); }; var brew = param.brew || function(){ throw new Error( '必須傳遞brew方法' ); }; var pourInCup = param.pourInCup || function(){ throw new Error( '必須傳遞pourInCup方法' ); }; var addCondiments = param.addCondiments || function(){ throw new Error( '必須傳遞addCondiments方法' ); }; var F = function(){}; F.prototype.init = function(){ boilWater(); brew(); pourInCup(); addCondiments(); }; return F; }; var Coffee = Beverage({ brew: function(){ console.log( '用沸水沖泡咖啡' ); }, pourInCup: function(){ console.log('把咖啡倒進杯子'); }, addCondiments: function(){ console.log('加糖和牛奶'); } }); var coffee = new Coffee(); coffee.init();
上述代碼使用在線HTML/CSS/JavaScript代碼運行工具http://tools.jb51.net/code/HtmlJsRun測試運行結(jié)果:
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
網(wǎng)站題目:JavaScript設(shè)計模式之模板方法模式原理與用法示例
分享URL:http://bm7419.com/article2/gijpic.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、品牌網(wǎng)站制作、靜態(tài)網(wǎng)站、網(wǎng)站導(dǎo)航、標簽優(yōu)化、品牌網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)