JavaScript 23 种设计模式之 8 桥接模式

痛定思痛。 2023-03-13 01:57 104阅读 0赞

### JavaScript 23 种设计模式之 8 桥接模式 ###

*  概念与特点
 *  结构与实现
 *  应用场景
 *  应用实例
 *  总结

# 概念与特点 #

概念：  
使用组合关系代替继承关系，减少子类数量。将抽象和实现分离，降低耦合度。

特点：

1.  功能的拓展能力更强，系统更灵活。
2.  实现细节透明化。

# 结构与实现 #

桥接模式包含抽象化类，拓展抽象化类，实现化类，具体实现化类。  
抽象化类：定义一个抽象化类，其中包括一个抽象方法，一个对实现化类对象的引用。  
拓展抽象化类：抽象化类的子类，实现抽象方法，通过组合关系调用实现化类的业务方法。  
实现化类：定义实现化类的接口，供拓展抽象化类调用。  
具体实现化类：实现化接口的具体实现。

**小剧场：**  
小王的女盆友小花要过生日了。小王想自己准备蛋糕，小王知道女盆友喜欢喝果汁，所以想准备一个果汁蛋糕。但是小王不知道小花喜欢什么样的蛋糕，也不知道小花喜欢什么样的果汁。于是小王做了一个蛋糕模型。该模型可以将不同的果汁和不同类型的蛋糕任意组合成果汁蛋糕。小王做了以下事情。

1.  先做一个抽象的蛋糕，只有奶油，并在蛋糕上留一个孔，可以注入不同的果汁。
2.  然后涂上芝士，做一个芝士蛋糕，芝士蛋糕同样可以抹上不同的果汁。
3.  万一不喜欢芝士蛋糕昵？再做一个草莓蛋糕，同样的，可以直接在草莓蛋糕上抹上不同的果汁。
4.  准备一杯抽象的果汁，只有榨汁杯和部分水。
5.  切一点香蕉，做一杯香蕉汁。
6.  万一不喜欢香蕉汁昵？切一点苹果，再做一杯苹果汁。
7.  取一杯香蕉汁，导入到芝士蛋糕里，美味的香蕉芝士蛋糕就做好了。

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <script>
        //抽象化角色-蛋糕
        class Cake{ 
            //对果汁的引用
            constructor(juice){ 
                this.juice= juice;
            }
            //抽象方法-拿到蛋糕
            getCake(){ 
    
            }
        }
        //拓展抽象化角色-芝士蛋糕
        class CheeseCake extends Cake{ 
            constructor(juice){ 
                super(juice);
            }     
            getCake(){ 
                //组合果汁和芝士蛋糕
                return this.juice.getJuice()+ ' Cheese Cake'
            }
        }
        //拓展抽象化角色-草莓蛋糕
        class BerriesCake extends Cake{ 
            getCake(){ 
               //组合果汁和草莓蛋糕
                return this.juice.getJuice()+ ' Berries Cake'
            }
        }
        //实现化角色-果汁
        class Juice{ 
            getJuice(){ 
    
            }
        }
        //具体实现化角色-香蕉汁
        class BananaJuice extends Juice{ 
            getJuice(){ 
                return 'BananaJuice '
            }
        }
        //具体实现化角色-苹果汁
        class AppleJuice extends Juice{ 
            getJuice(){ 
                return 'AppleJuice '
            }
        }
        class PrepareCake{ 
            static main(){ 
                //取一杯香蕉汁
                let bananaJuice = new BananaJuice();
                //香蕉汁倒入芝士蛋糕中
                let cheeseCake = new CheeseCake(bananaJuice);
                //香蕉芝士蛋糕成型
                let cake = cheeseCake.getCake();
                console.log(cake)
            }
        }
        PrepareCake.main();
    </script>
    </body>
    </html>

# 应用场景 #

1.  一个类存在两个以上独立变化的维度，且这些类都要进行拓展。
2.  多层次的继承关系导致子类急剧增加。
3.  抽象化类和具体化类之间想要增加更多的灵活性。

# 应用实例 #

暂无。

# 总结 #

桥接模式使用的场景主要是独立的多个子类拓展性很强，就不适合使用继承关系去实现业务。比如包包的分类维度有多种。按照功能有手提包、公文包、钱包等，按照颜色有白色、红色、黄色等。这种情况下就可以在抽象层使用组合关系去实现而不是继承关系。