美文网首页
JS设计模式之工厂设计

JS设计模式之工厂设计

作者: superestZe | 来源:发表于2018-12-13 23:04 被阅读0次

在前端, 特别是图形化数据呈现的时候, 可能面临数据转化成图标的需求, 但是如果单个图标的生成或者操作, 维护起来是一件很麻烦的事情, 因此, 工厂模式的设计模式可以帮助我们解决这个问题。

今天先来浅谈一下工厂模式, 先上代码:

class Product {
    constructor(name) {
        this.name = name;
    }

    init() {
        alert('init1');
    }

    fun1() {
        alert('fun1');
    }

    fun2() {
        alert('fun2');
    }
}

class Creator {
    constructor(name) {
        return new Product(name);
    }
}

let creator = new Creator('p1');

creator.init();
creator.fun1();

创建的类, 返回另外一个实例化的类。
从中我们可以得到启发, 就是把数据类和图表进行组合, 然后返回一个组合后的类, 可以以数据驱动, 来生成多个图标, 项目的github地址

相关文章

  • 前端设计模式

    JS设计模式一:工厂模式jS设计模式二:单例模式JS设计模式三:模块模式JS设计模式四:代理模式JS设计模式五:职...

  • iOS设计模式(三)之抽象工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • iOS设计模式(一)之简单工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • iOS设计模式(二)之工厂模式

    设计模式系列传送门 iOS设计模式(一)之简单工厂模式iOS设计模式(二)之工厂模式iOS设计模式(三)之抽象工厂...

  • 设计模式之工厂模式

    设计模式之工厂模式 标签(空格分隔): 设计模式 工厂模式 设计模式的感念 设计模式的应用 工厂设计模式的产生 工...

  • iOS设计模式之美-适配器模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-抽象工厂模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-工厂模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • iOS设计模式之美-生成器模式

    iOS设计模式之美-工厂模式iOS设计模式之美-抽象工厂模式iOS设计模式之美-生成器模式iOS设计模式之美-适配...

  • 设计模式系列

    创建型模式: 设计模式之工厂模式(Factory Pattern)设计模式之抽象工厂模式(Abstract Fac...

网友评论

      本文标题:JS设计模式之工厂设计

      本文链接:https://www.haomeiwen.com/subject/ovmihqtx.html