关于extjs开发的方式

用ext做开发也有2，3个月了，都是公司的人自己摸索的，现在我们的开发方式是一个模块一个js文件，这样导致的结果就是展现逻辑和一些业务逻辑（主要是和向后台发信息和收信息后的处理之类的）混在一起，一个js文件几千行，极难维护，有点像早期的model1纯jsp开发， 现在想的是能不能像model2一样，把所有的业务代码抽取成一个一个的方法放到一个js文件中，然后页面的代码放到另一个文件中，完全分开，但这样可能带来的一个可能的坏处是，有时业务代码是要访问上下文对象的，不知大家怎么看

评论

21 楼 8vip 2009-10-14  

我也用ext开发过.那满篇的JS
和空空的body体让人看着真的不舒坦

20 楼 need_faith 2009-10-14  

lich0079 写道

那么大家的那个单页面一般占多少内存
我们现在的项目在任务管理器看上个100m很平常

70-80M左右

19 楼 lich0079 2009-10-14  

那么大家的那个单页面一般占多少内存
我们现在的项目在任务管理器看上个100m很平常

18 楼 mr.a 2009-10-14  

关注! 我也做了半年ext了  发现代码写得长了效率直线下降

17 楼 whaosoft 2009-10-13  

例子还行 实际用 我估计我用的不如应届生 因为就零星的用了一下 还是很少的功能 不过 好像那个 base的js 就好几十mb 很不爽

16 楼 ferly_j 2009-10-13  

千万不要弄成单页面程序，看看内存的泄漏你就知道后果有多么的严重！
ext用了一年，
对于做大一点的项目有心理阴影……

15 楼 andy_ghg 2009-10-13  

回复楼上,js是弱类型的语言,有利有弊,这就牵扯到Javascript的本质上去了,那个说起来可以说是滔滔不绝.......本人不是JS行家(开发Extjs并不需要深厚的JS功底,但是JS底子越厚你写起来越牛X毕竟EXTJS是基于Javascript的).

不用刻意去模仿java,刻意的去模仿只会适得其反.好的咱就拿来,不适用的咱就不用,Javascript写习惯了...返回头去做java你会发现后台语言的编写和调试原来如此美好.....
(心情不好就去医院走走....)
你的第四个问题,我想说,我现在手上的这个项目正在逐渐的减少html页面(理论上完全可以达到OAOP),当你习惯了组件化开发之后,这些都不是问题,谁先加载谁后加载都一样(onReady的当然必须是最后加载的....),你可以写一个专门用来导入js的js文件如:
function ImportJS(url,charset){
    if(!charset){
       charset = "utf-8";
    }
    document.write("<script src = '/YourProject/"+url+"' charset = '"+charset+"'/>");
}
//////////////App.Scenen包下的JS///////////////
Import("/App/Scene/App.Scene.XX.js");
Import("/App/Scene/App.Scene.YY.js","gbk");
//////////////........包下的js//////////////
...
..
..


这个东西就比较好管理你的js代码了

14 楼 piaoyaohou 2009-10-13  

geweixin 写道

我用EXT将近1年半了，我觉得EXT也可以类似JAVA一样的开发方式，每一个JS文件一个类，一个对象，
然后需要调用的时候，new 一下！！，我在开发中就是这么做的。。。

我也是这么开发的，但在开发过程中类似java开发不容易，以下几个问题不好解决

1、开发IED问题不好解决，使用skpet插件，类似java开发很多东西都不提示，尤其不能像java一样跟踪函数。手写那个痛苦啊。
2、调试，js是动态语言，调试那个痛苦啊。虽然有firedebug等等一些调试工具。做到像java一样方便调试
几乎不可能。

3、模拟java bean get set 方法，怎么都觉得别扭。

4、分到多个js文件，动态加载也是个问题，手写加载js文件那个痛苦啊。，并且名称空间有重复的，也不报错。靠自己管理。

总之，缺乏合适的IED，EXTJS开发效率极低。

13 楼 andy_ghg 2009-10-13  

我们使用的是对象,我上面的意思就是在基类里面不能出现ID....而根据这个基类派生出来的对象你爱咋咋地......

12 楼 lich0079 2009-10-13  

我设置ID主要就是为了不同的js文件间，或者不同的作用域里互相用ext.getCmp()访问对象用的，否则很多对象访问不到，无法交互

11 楼 andy_ghg 2009-10-13  

组件里有ID存在的话(除非这个id是Ext.id()生成的)
源码如下
id : function(el, prefix){
            return (el = Ext.getDom(el) || {}).id = el.id || (prefix || "ext-gen") + (++idSeed);
        },

否则你的组件在页面中同时只能存在一个对象......那要了还有啥用呢....

10 楼 andy_ghg 2009-10-13  

源码中的Ext.WindowGroup应该看一看,还有Ext.StoreMgr

9 楼 andy_ghg 2009-10-13  

因为你现在只有一个页面,当页面中保留有这个对象的引用,这个对象就不会给GC回收,你的组件可以公开一些函数供外部调用.这是一个办法.
还有一个办法就是代理数据,你可以把需要交互的数据放在一个全局的函数中.函数维护一个数组.

8 楼 lich0079 2009-10-13  

模块间有交互 紧耦合，你是怎么解决的


不能设置组件的(包括该组件下的小组件的)ID这个属性   why

7 楼 andy_ghg 2009-10-13  

我觉得,开发EXTJS,首先要建立的就是组件化编程,你把一个form作为一个组件,也可以将半个页面都作为一个组件.当组件化编程之后你就要考虑分类别,分模块开发了,

我认为,一个组件一个JS文件,多个组件拼接成一个模块,这些组件都放在一个文件夹下,命名方法其实很简单,类似java如:
在App文件夹下的Scene文件夹内
App.Scene.ScreenManager.js
    Ext.namespace("App.Scene.ScreenManager.XX","App.Scene.ScreenManager.YY");

App.Scene.ScreenControl.js
    Ext.namespace("App.Scene. ScreenControl.XX","App.Scene. ScreenControl.YY");

App.Scene.Main.js
    Ext.namespace("App.Scene. Main.XX","App.Scene.Main.YY");

在App文件夹下的Business文件夹内
App.Business.CheckUser.js
    //同上
App.Business.Logout.js
    //同上

并且,切记,要把Extjs当做java来写,因此,你的程序只能有一个入口即只能允许整个程序中只出现一个
Ext.onReady(function(){

});
很多人不信Extjs可以这样写,说只能应用在小型的项目中,但是我可以告诉你,这样的写法完全适用与大项目,而且是项目越大越能展现出他的好处

我经历过刻骨铭心的失败总结出以下几点经验:
1.绝不使用全局变量(如有必要,可以用静态方法来做)
2.不能设置组件的(包括该组件下的小组件的)ID这个属性,(此组件的派生类你可以随意).
3.稀奇古怪的代码少写,因为你不能保证你的EXTJS版本永远停留在当前版本上(如果公司有钱买授权的话)
4.能在后台完成的业务逻辑坚决不在前台做,即使在前台做看起来比较简单(如果前台坐起来非常简单就算了,例如验证)
5.统一管理你的JSON生成.
6.规范你的代码


我下面有一段代码是我的风格,当然可能并不适合你:

Ext.ns("App.Users.CURD");
/**
 * 必要的注释一个不能少,Javascript代码维护起来没有java好维护....
 *
 */
App.Users.CURD = Ext.extend(Ext.Panel,{
    //属性代码全部写在这里
    title:"CURD",
    //初始化组件(如果你的组件需要改变样式或者需要动它的dom,你可以重写父类的onRender,并把部分视图代码放在onRender函数中)
    initComponent:function(){
        App.Users.CURD.superclass.initComponent.call(this,arguments);
        //先定义自定义事件(如果必要的话)
        
        //接着视图代码全部写在这里

    },
    //方法函数全部写在这里
    //先将与后台数据交互的函数写出来
    addUser : function() {
        //对应后台同名的Action方法函数
    },
    delUser : function() {
        //对应后台同名的Action方法函数
    },
    updateUser : function() {
        //对应后台同名的Action方法函数
    },
    //供自己内部使用的函数跟在后面
    formClear : function() {

    },
    //提供给外部调用的函数紧跟数据操作
    getSelectUsers : function(){
        return ......
    }
    setXXXX : function() {
    },
    //最后就是事件处理函数,因为函数比较多,事件处理往往伴随着页面逻辑,放在后面比较好找....混在中间不太好找
    onSubmit : function() {

    },
    onDelet : function() {

    }
});

//*因为是基于UI的组件,因此一般都可以独立测试,测试通过后注释掉即可(注意我的注释写法)
Ext.onReady(function(){
    //.........
});
//*/

最后一句....无论是ASP.NET组件(Coolite)还是什么可视化组件,前期学习都不要使用.

6 楼 yonglin4605 2009-10-13  

那就用GWT吧

5 楼 andy_ghg 2009-10-13  

现在正在上班,晚上好好的回你一贴,我做EXTJS一年多了.

4 楼 lich0079 2009-10-13  

分成模块的话 假如个个模块间有交互呢，
我点击这个树的过程中，那个grid也要动态刷新，那么我就要去操作那个grid的ds，如何获得呢，ext.getCmp('xx'),那么这个代码就写死了
更普遍的说 很多情况下实现都是紧耦合，我认为模块化最主要是为了复用

3 楼 Rooock 2009-10-13  

 
<script type="text/javascript" src="ext的js"></script>
<script type="text/javascript" src="common.js"></script>
<script type="text/javascript" src="module_1.js"></script>
...
<script type="text/javascript" src="module_x.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
    //  不同的模块定义在不同的js中
    var module_1 = functionInModule_1();
    ....
});
</script>

2 楼 geweixin 2009-10-13  

我用EXT将近1年半了，我觉得EXT也可以类似JAVA一样的开发方式，每一个JS文件一个类，一个对象，
然后需要调用的时候，new 一下！！，我在开发中就是这么做的。。。