定義

橋接設(shè)計(jì)模式（Bridge Pattern）是一種結(jié)構(gòu)型設(shè)計(jì)模式，它用于將抽象部分與其具體實(shí)現(xiàn)部分分離，使它們可以獨(dú)立地變化。

組成

在橋接模式中，有兩個(gè)關(guān)鍵角色：

• 抽象部分（Abstraction）：抽象部分定義了高層的接口和功能，它持有一個(gè)對(duì)實(shí)現(xiàn)部分的引用。抽象部分通常包含被抽象了的方法或接口，用于定義高層接口的操作。 注意這里被抽象了的方法或接口不是Ts中的抽象方法。

• 實(shí)現(xiàn)部分（Implementation）：實(shí)現(xiàn)部分定義了具體的實(shí)現(xiàn)邏輯，它通常是一個(gè)接口或抽象類，并提供了供抽象部分調(diào)用的具體方法。

• 通過(guò)將抽象部分和實(shí)現(xiàn)部分分離，橋接模式允許它們可以獨(dú)立地變化。這種解耦的好處在于，當(dāng)需要新增一個(gè)抽象部分或?qū)崿F(xiàn)部分時(shí)，不需要修改已有的代碼。

代碼

// 實(shí)現(xiàn)部分 - 具體實(shí)現(xiàn)A 
class DomElementHandler { 
    constructor(elementId) { 
        this.elementId = elementId; 
    } 
    setText(text) { 
        const element = document.getElementById(this.elementId); 
        element.textContent = text; 
    } 
} 
// 抽象部分 - 橋接類 
class DomBridge { 
    constructor(handler) { 
        this.handler = handler; 
    } 
    /* 錯(cuò)誤的寫法
    constructor(){
        this.handler = new DomElementHandler("myElement");
    }
    */
    setText(text) { 
        this.handler.setText(text); 
    } 
} 
// 示例用法 
const domHandler = new DomElementHandler("myElement"); 
// 創(chuàng)建具體實(shí)現(xiàn)A對(duì)象 
const domBridge = new DomBridge(domHandler); 
// 使用具體實(shí)現(xiàn)A創(chuàng)建橋接對(duì)象 
domBridge.setText("Hello, Bridge Pattern!"); 

符合DIP原則

依賴倒置原則：依賴倒置原則是面向?qū)ο笤O(shè)計(jì)中的一個(gè)重要原則，它主張高層模塊不應(yīng)該依賴于低層模塊，兩者都應(yīng)該依賴于抽象。也就是說(shuō)，【抽象不應(yīng)該依賴于具體實(shí)現(xiàn)細(xì)節(jié)，具體實(shí)現(xiàn)細(xì)節(jié)應(yīng)該依賴于抽象】。

橋接模式通過(guò)引入一個(gè)橋接接口或抽象類來(lái)實(shí)現(xiàn)依賴倒置原則。

抽象部分和實(shí)現(xiàn)部分之間通過(guò)組合關(guān)系進(jìn)行關(guān)聯(lián)。這樣，抽象部分不依賴于具體實(shí)現(xiàn)類，而是依賴于抽象接口或抽象類，從而實(shí)現(xiàn)了依賴倒置。

對(duì)比策略模式

• 策略模式提供了一個(gè)修改策略的接口，而橋接模式注入實(shí)現(xiàn)的過(guò)程是在構(gòu)造函數(shù)中，所以是不可變的
• 橋接模式強(qiáng)調(diào)抽象和實(shí)現(xiàn)的解耦，所以方法名必須一致，都是setText，而策略模式可能會(huì)用到多個(gè)策略，并且使用的方法不抽象
• 策略模式使用多個(gè)策略的時(shí)候可以將它們隨意組合，而橋接模式必須保證抽象方法和實(shí)現(xiàn)方法同名，不能將實(shí)現(xiàn)對(duì)象組合使用

使用場(chǎng)景

原生js中沒(méi)有直接對(duì)此模式的使用，但是在UI庫(kù)開(kāi)發(fā)，動(dòng)畫，主題，獲取數(shù)據(jù)源的業(yè)務(wù)場(chǎng)景中用得較多。

總結(jié)

橋接模式解決的是：統(tǒng)一提調(diào)來(lái)自不同類的實(shí)例對(duì)象上的同名方法的問(wèn)題。

到此這篇關(guān)于詳解JS設(shè)計(jì)模式之橋接模式用法的文章就介紹到這了,更多相關(guān)JS橋接模式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論