前言
工厂方法模式是通过对产品类的抽象使其创建业务主要负责用于创建多类产品的实例,按照之前的介绍,如果随着业务的开展,需求不断的增加,假如使用简单工厂模式
,那么我们需要添加对应的类,以及在工厂函数中新增对应的case分支代码,
来创建对应的实例。
将原本的工厂方法,当作一个类对象,需要新增的需求,都只需要通过在该类中的不同属性来对应创建不同的实例对象即可,且不同的实例对象它们之间共享着由工厂方法提供的共同属性。
⚠️ 由于是工厂方法,有可能在使用过程中,不小心当作普通的方法来调用了,因此可以采取将方法保护起来的方式
安全的方法工厂类
1 | var Factory = function(type, content) { |
ES5代码
1 | // 用于创建在一个页面中不同功能的按钮 |
上述程序的一个输出结果如下:
通过上述的方式,将一个数组按钮配置,对应渲染为页面的一个个按钮div节点,并对其进行赋值,这里工厂方法的原型对象中的每一个属性代表一个对象,原本表面执行的new Factory
创建一个工厂对象,实际上是通过传递参数,
告知工厂,拿传递过来的信息去创建对应的对象,从而来创建不同的一类对象实例。
🤔 这里👆的代码中对于每个实例对象来说,还是带用重复性的代码,如果将这个代码给抽离起来的话,那么应该可以做到代码更加简洁
优化后的ES6代码
1 | // SuperBtn.js |
1 | // Factory.js |
1 | <script> |
对应的输出结果是:
这里我们采用ES6.0的方式,将原本Factory
工厂类中的方法,编程一个个的返回一个公共的组件:SuperBtn,通过在这个公共组件中封装了对应的属性以及方法,提供统一的一个render函数,来将自己给渲染出来
最后更新: 2022年12月31日 07:37
原始链接: https://www.91temaichang.com/2022/03/03/factory-methods-design-mode/