JavaScript:工厂模式

2022-03-22 18:43:48 浏览数 (1)

1、前言

工厂模式顾名思义是开发者不需要去关注一些基类的实现方式,只需要知道工厂类就行。然后开发者这个工厂类去自行的开发自己需要的对象。这种叫做工厂函数也就是最简单的工厂模式。

这种模式主要应用于数据应用的模块结构类似,比如:注册,登录模块。 测试用例创建两个类,一个打印类,一个运算符操作类,

  • 创建一个打印类Print: 打印类中有属性operator以及函数方法printFun
代码语言:javascript复制
// 创建一个打印类
const Print = function(num1, num2) {
    this.operator = '打印数据';
    this.printFun = function() {
        return `打印${num1}以及${num2}数据`;
    }
}
  • 创建运算符操作类Operate : Operate类中operateFun 方法通过接收操作类型也就是type的值,用来返回不同运算操作的值出去。
代码语言:javascript复制
// 创建一个运算操作类
const Operate = function(num1, num2) {
    this.operator = '运算符操作';
    this.operateFun = function(type) {
        switch(type) {
            case ' ':
                return num1   num2;
                break;
            case '-':
                return num1 - num2;
                break;
            case '*':
                return num1 * num2;
                break;
            case '/':
                return num1 / num2;
                break;
        }
        
    }
}
  • 创建工厂类createFactory :
代码语言:javascript复制
// 简单工厂模式
const createFactory = function(name, num1, num2) {
    switch (name){
        case 'print':
            // 返回一个打印类的对象实例
            return new Print(num1, num2);
            break;
        case 'operate':
            // 返回一个运算类的对象实例
            return new Operate(num1, num2);
            break;
        default:
            break;
    }
}

这个工厂类都是对传入的num1和num2两个数据进行不同逻辑的处理

  • 使用prototype原型链去拓展自行需要的方法: 原本的打印类只是单纯的打印出来了数据,现在我的需求是想通过弹出层弹出数据,就可以通过如下代码实现。
代码语言:javascript复制
// 拓展
Print.prototype.alertFun = function(num1, num2) {
    alert(`弹出${num1}、${num2}数据!`)
}
  • 创建工厂模式中的基类实例对象:
代码语言:javascript复制
// 开始使用
const obj1 = new createFactory('print', 10, 3);
const printMsg = obj1.printFun();
obj1.alertFun(1, 2);
console.log(printMsg);

const obj2 = new createFactory('operate', 15, 4);
const result = obj2.operateFun('*');
console.log(result);

0 人点赞