這篇文章主要講解了如何使用javascript中的橋接模式，內(nèi)容清晰明了，對此有興趣的小伙伴可以學(xué)習(xí)一下，相信大家閱讀完之后會有幫助。

創(chuàng)新互聯(lián)公司是專業(yè)的孟州網(wǎng)站建設(shè)公司，孟州接單;提供網(wǎng)站設(shè)計(jì)制作、成都做網(wǎng)站,網(wǎng)頁設(shè)計(jì),網(wǎng)站設(shè)計(jì),建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進(jìn)行孟州網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴(kuò)展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團(tuán)隊(duì),希望更多企業(yè)前來合作!

介紹：如果軟件系統(tǒng)中某個(gè)類存在兩個(gè)或多個(gè)獨(dú)立變化的維度，可以通過橋接模式將這些維度分離出來，使兩者可以獨(dú)立擴(kuò)展，讓系統(tǒng)更符合單一職責(zé)原則。

定義：將抽象部分與其實(shí)現(xiàn)部分分離，使他們都可以獨(dú)立的變化。它是一種對象結(jié)構(gòu)型模式，又稱為柄體模式或接口模式。

場景：我們做一個(gè)簡單的畫圓，將圓的半徑和顏色這兩個(gè)維度進(jìn)行分離，使每一個(gè)維度都可以單獨(dú)擴(kuò)展，很多同學(xué)都說這么簡單一個(gè)需求我5行代碼就實(shí)現(xiàn)了。為什么寫這么啰嗦一套。
我們這里分享的是設(shè)計(jì)思想，當(dāng)你的系統(tǒng)足夠復(fù)雜時(shí)需要用什么樣的方式進(jìn)行優(yōu)化。作為示例，也只是用最小的例子把道理講明白，不是說所有類似的地方就必須這么寫。什么樣的場景需要什么樣的模式，需不需要用模式需要你自己去考量。

示例：

var CircularColor = {};
CircularColor.redCircular = function(){
  this.getColor = function(){
    return 'red';
  }
}
CircularColor.greenCircular = function(){
  this.getColor = function(){
    return 'green';
  }
}
 
var CircularRadius = {};
CircularRadius.small = function(){
  this.x = this.y = 0;
  this.radius = 5;
  this.color = null;
  this.setColor = function(circularColor){
    this.color = circularColor.getColor();
  }
  this.draw = function(){
    console.log('畫一個(gè)小圓！顏色：' + this.color + ' 原點(diǎn)坐標(biāo)：x:' + this.x + ' y:' + this.y + ' 半徑：' + this.radius);
  }
}
CircularRadius.big = function(){
  this.x = this.y = 0;
  this.radius = 20;
  this.color = null;
  this.setColor = function(circularColor){
    this.color = circularColor.getColor();
  }
  this.draw = function(){
    console.log('畫一個(gè)大圓！顏色：' + this.color + ' 原點(diǎn)坐標(biāo)：x:' + this.x + ' y:' + this.y + ' 半徑：' + this.radius);
  }
}
 
var color = new CircularColor.redCircular();
var radius = new CircularRadius.big();
radius.setColor(color);
radius.draw();//畫一個(gè)大圓！顏色：red 原點(diǎn)坐標(biāo)：x:0 y:0 半徑：20

這節(jié)需要說一個(gè)點(diǎn)，橋接模式在java的介紹里，獨(dú)立之后的維度是在抽象層會建立關(guān)聯(lián)關(guān)系，js沒有抽象層，所以兩個(gè)獨(dú)立維度通過一個(gè)setColor方法建立關(guān)聯(lián)關(guān)系。

橋接模式總結(jié)：

優(yōu)點(diǎn)：

* 橋接模式提高了系統(tǒng)的可擴(kuò)展性，在兩個(gè)變化維度中任意擴(kuò)展一個(gè)維度，都不需要修改原有系統(tǒng)，符合開關(guān)原則。
* 多數(shù)情況下，橋接模式可以取代多層集成方案。
* 分離接口及其實(shí)現(xiàn)部分，使得實(shí)現(xiàn)可以沿著各自的維度來變化。

缺點(diǎn)：

* 橋接模式的使用會增加系統(tǒng)的理解與設(shè)計(jì)難度。
* 橋接模式要求正確識別出系統(tǒng)中兩個(gè)獨(dú)立變化的維度，因此其使用范圍具有一定的局限性。

適用場景：

* 一個(gè)類存在兩個(gè)或多個(gè)獨(dú)立變化的維度，且這些維度都需要獨(dú)立進(jìn)行擴(kuò)展。

看完上述內(nèi)容，是不是對如何使用javascript中的橋接模式有進(jìn)一步的了解，如果還想學(xué)習(xí)更多內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前名稱：如何使用javascript中的橋接模式
當(dāng)前路徑：http://aaarwkj.com/article22/gjjdjc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供域名注冊、搜索引擎優(yōu)化、、云服務(wù)器、網(wǎng)站營銷、虛擬主機(jī)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)