ExtJS 有标准的设计模式吗

Posted 2023-02-26

【中文标题】ExtJS 有标准的设计模式吗

【英文标题】：Is there a standard design pattern for ExtJS

【发布时间】：2011-08-24 15:45:46

【问题描述】：

我们在旗舰应用程序中大量使用 ExtJS 3.x。我们应用程序的管理区域分为我们提供的不同模块。每个模块，以及随后模块的不同 CRUD 操作的每个页面都有自己的 .js 文件来处理功能。

刚开始时，我们只是将所有代码放入Ext.onReady()，并没有真正担心全局命名空间（嘿……我们从未真正认为自己是 javascript 开发人员）。在掌握了 ExtJS 的窍门后，我开始使用单例模式，并像这样从Ext.onReady() 调用 init 方法。

var newModule = 
    propertyOne: 'asfd',
    propertyTwo: 'asdf',
    init: function() 
        // set up
    
;

Ext.onReady(function() 
    newModule.init();
);

这是对 javascript 单例模式的正确使用吗？有没有比单例更适合 ExtJS 的模式，比如模块模式？

我一直使用this guide 作为学习 Javascript 设计模式的起点。

【问题讨论】：

如果你有足够的资源，你可以升级到 extjs 4 并使用他们强大的 MVC 应用程序来设计你的应用程序，而不用担心命名空间。

不幸的是，现在升级是不可能的。我们计划在我们的软件达到稳定版本后立即升级。我迫不及待想要使用 MVC 模式和新的 Sass 主题系统。

在 Ext JS 3.x 中使用 a 模块设计模式的其他细节可以在这里找到：ExtJS (JavaScript) Module Design Pattern best practices

【参考方案1】：

我们最终决定升级到 ExtJS，似乎有了新的 MVC 架构，设计 ExtJS 软件的最佳方式是使用Ext.application()

你可以阅读它here。

【参考方案2】：

您可以查看here 例如创建自己的模块，文件Module.js。我们在自己的应用程序中使用了这种模式并且没有遇到任何问题。

Ext.app.Module = function(config)
    Ext.apply(this, config);
    Ext.app.Module.superclass.constructor.call(this);
    this.init();


Ext.extend(Ext.app.Module, Ext.util.Observable, 
     init : Ext.emptyFn
);