《設計模式》 - 6. 橋接模式( Bridge )
Javascript設計模式 - 原文連結
Tips : 後文中的 ctor函式是cocos2d - JS 中建構函式 .
橋接模式 ( Bridge ) :
語言 : JavaScript
說明 :
以畫筆為例 , 假設畫筆有3種型號 (大 、中 、小) 和 3種顏色 (黑 、白 、紅) . 正常情況下 每個型號和每種顏色組合(小黑 、中黑 、大黑 、 小白 、中白…)都需要一支 , 那就需要 3*3 = 9 支筆 . 當需求變化時 , 型號和顏色越來越多 , 新增筆的種類也是成倍增加的 , 這時候就需要想辦法解決這個問題 .
解決辦法 :
實際情況中 , 當需要小型筆 和 黑色時 , 只需要用小型筆沾上黑色墨水 , 就可以解決這個問題 , 在程式中也可以把 3種型號的筆 和 3種顏色區分開 , 需要時設定對應的顏色即可 .
顏色類 ( Color ) :
父類 (Color) 屬性 value 用來儲存顏色 , 方法getColor() 用來獲取顏色, 三個子類都繼承父類的屬性和方法 .
var Color = cc.Class.extend({
value : null,
getColor: function(){
return this.value;
}
});
var Black = Color.extend({
//ctor 是建構函式
ctor: function(){
this.value = "Black";
}
});
var White = Color.extend({
ctor: function(){
this.value = "White";
}
});
var Red = Color.extend({
ctor: function(){
this.value = "Red";
}
});
筆類 ( Pen ) :
var Pen = cc.Class.extend({
color : null,
size : null,
setColor: function(color){
this.color = color;
},
draw: function(){
console.log(this.color + " Picture - By : "+ this.size);
}
});
var Small_Pen = Pen.extend({
ctor: function(){
this.size = "Small-Size Pen";
}
});
var Medium_Pen = Pen.extend({
ctor: function(){
this.size = "Medium-Size Pen";
}
});
var Big_Pen = Pen.extend({
ctor: function(){
this.size = "Big-Size Pen";
}
});
客戶類 ( Client ) :
var pen = new Small_Pen(); //例項化小型筆
var color = new Black(); //例項化黑色
pen.setColor(color.getColor()); //給筆設定顏色
pen.draw(); //Black Picture - By : Small-Size Pen
結果顯示 :
相關文章
- 設計模式 | 橋接模式(bridge)設計模式橋接
- C#設計模式-橋接模式(Bridge Pattern)C#設計模式橋接
- 設計模式 - Bridge 橋模式設計模式
- 設計模式-橋接模式設計模式橋接
- Java設計模式-橋接模式Java設計模式橋接
- 小白設計模式:橋接模式設計模式橋接
- 設計模式之【橋接模式】設計模式橋接
- 設計模式(八)——橋接模式設計模式橋接
- 設計模式之橋接模式設計模式橋接
- Java橋模式(Bridge模式)Java模式
- 9.設計模式-橋接模式設計模式橋接
- PHP 設計模式之橋接模式PHP設計模式橋接
- 極簡設計模式-橋接模式設計模式橋接
- GoLang設計模式19 - 橋接模式Golang設計模式橋接
- Java設計模式(7)----------橋接模式Java設計模式橋接
- 設計模式(七)橋接設計模式橋接
- 設計模式之橋接設計模式橋接
- 設計模式之旅12--橋接模式設計模式橋接
- Java設計模式之(六)——橋接模式Java設計模式橋接
- 設計模式學習-裝飾模式,橋接模式設計模式橋接
- 設計模式(十三)----結構型模式之橋接模式設計模式橋接
- (精華)2020年8月28日 二十三種設計模式(七)-橋接模式(Bridge Pattern)設計模式橋接
- 10.橋接模式設計思想橋接模式
- 跟著GPT學設計模式之橋接模式GPT設計模式橋接
- 從零開始學設計模式(七)—橋接模式設計模式橋接
- 設計模式學習-使用go實現橋接模式設計模式Go橋接
- 設計模式:橋接模式及程式碼示例、橋接模式在jdbc中的體現、注意事項設計模式橋接JDBC
- 2.2 橋接 Bridge橋接
- 設計模式 第七章 橋接模式、裝飾者模式、組合模式設計模式橋接
- 設計模式學習筆記(九)橋接模式及其應用設計模式筆記橋接
- 結構型模式:橋接模式模式橋接
- Java進階篇設計模式之四 -----介面卡模式和橋接模式Java設計模式橋接
- 08_橋接模式橋接模式
- JavaScript面試系列:JavaScript設計模式之橋接模式和懶載入JavaScript面試設計模式橋接
- 使用橋接模式設計複雜的訊息系統橋接模式
- c#橋接模式詳解C#橋接模式
- 橋接模式(c++實現)橋接模式C++
- 小白都能懂的設計模式 java版 橋接模式具體實現(超詳細)設計模式Java橋接