Ext JS 4的倒数:动态加载和新的类机制 Count down to Ext JS 4: Dynamic Loading and New Class System (上)

标签: extclasssystemfunctiongetterjavascript
7084人阅读 评论(7) 收藏 举报
分类:

Ext JS 4的倒数:动态加载和新的类机制 Count down to Ext JS 4: Dynamic Loading and New Class System (上)  

January 19, 2011 by Ed Spencer 翻译 Ext中文网(ajaxjs.com) Frank
http://www.sencha.com/blog/2011/01/19/countdown-to-ext-js-4-dynamic-loading-and-new-class-system/

Ext JS 4 发布在即,官方Sencha.com/blog近期也发出介绍4.0新特性、新功能的稿子。Ext中文网过去几期都有对4.0的深入文章,希望可以做到与官网同步,为大家跟进新版本的信息。——至于何时能够释出代码,以及为啥推迟,,官方给我们的理由是为争取稳定性不惜花更多的时间去内部测试,故所以一再押后。我个人的印象是,Ext做东西从不贸然举动,为了较好的代码质量宁可不采纳那些不稳定的方案,推敲不起的代码……当然,届时出来了,表现怎么样还是一回事,就让我们耐心地拭目以待吧!

下为译文

JavaScript自己并没有类,所以一些新手开发者来的这儿就感觉环境很不熟悉。但是通过语言其自身强大的原型机制(prototype pattern) ,Ext JS实现一套成熟丰满的类机制系统,务求可以进一步照顾我们的开发者,能够以他们熟悉的面向对象方法论(Object Oriented approach)写代码!

我们为Ext JS 4注入更多的新功能,期待让你们的开发更轻松亦更灵活。Ext 4将会有引入四大新功能——类机制、多态Mixin、配置项的读写器Setter/Getter和动态加载。

 

上面的插图形象地介绍了类的系统,比较关注的是Draggable和Resizable变为Mixin形式了。

类的定义 Class Definition

为显示不同,我们拿Ext JS 3 创建类的方式来作比较。这是一个登陆功能的窗口,以Ext.Windows为基类来扩展:

一般来讲,这样子定义一个类是没有问题的。但是如果遇到Ext.Windows父类未曾定义的话就创建新子类,岂不会出现错误?的确,同样如果我们没定义过命名空间的话也是会出现错误的。在新的方式中,便解决了以上两个问题:

Ext JS 4的类名可以以字符串的形式写出,这样就保证不会上面的错误了。类管理器(Class Manager)会聪明地看出Ext.Windows是否已定义,如果还没有,就等待定义好了Windows才创建MyApp.LoginWindow这个类,也就是说内部会有”延时创建“的这么一个过程。我们在程序中不再需要严格按照加载的顺序,框架帮我们都处理好了。

多态 Mixins

行文至此才刚开始,Ext JS的类还有许多的功能留待你发现。其中首推介绍的是这个框架的“多态(Mixins)”能力。从多态的定义讲,是为了复用将多个动作和配置参数组合一起,再”混入(Mixed)“到某个类之中。要在您创建的类里面实现这种能力,只要引入多态的类到到您的类即可。例如,要使的你的类可拖动,混入Draggable Mixin类吧。不限定混入类的数量,也就是说,这是一种多重继承的实现方案,能较好地解决JavaScript多态的难题。可这样定义多态的类:

跟类定义的类似,引用类名称的都是字符串,故所以哪怕页面没加载的类也不会报错的。一个类允许加入多个混入,多态的那个类写法如下:

配置项自动的读写器 Auto Setters and Getters for Configurations

通过送入多种配置项,就可以客制化Ext JS类。然后透过getter和setter的方法也可以读取、修改这些配置项参数,运行时的时候也可以作修改。整个库之中会大量出现这种需求,怎么去维护好便是一个问题。Ext JS 4针对配置项参数的读、写、默认值、实时应用等这些具体的问题,提出了自动getter和setter的方案,务求凸显方便性,加速您的开发进程!我们看看例子:

这里我们设置的类只有一个单独的配置项参数title,分配了titile的默认值“Default Title”。在Ext JS 4的类机制下自动分配getter/setter的方法。而在旧的3.3版本中,要达到等价的方法,我们必须僵硬地写出那些手工代码:

框架会自动生成上面的四个函数。在许多情况中,更新变量(属性)尚足够了,可是我们想通过特定的方式改变某个配置项,这样会比较好。例如新类中有标题需要在DOM元素中显示,我们可以告知DOM更新,便是这样子:

类机制会自动生成上面四个函数,并且我们可以如上例的applyTitle方法来炮制方法的重写(override)。好处是不但能够节约您写代码时间上细微的花销,还能节约您程序的体积大小,换言之能让你的程序更快地被下载到客户端上。

 

(未完待续……)

----------------------------------------------------------------------------->

下半部分,将为大家介绍Ext 4的动态加载,并解释官方自带的四个例子——这是Ext从1.0以来用户便强烈需求的功能之一,或者觉得是“最最”需求的功能也不为过。因为单个ext-all.js的块头实在太大了,客户不仅下载得慢,而且还有冗余的代码——虽然网上有提供了多种方案,但多年来用户一直忍着,就是想让官方提供的方案,进行有益的指导。

0
0

猜你在找
查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1842423次
    • 积分:18466
    • 等级:
    • 排名:第472名
    • 原创:247篇
    • 转载:19篇
    • 译文:55篇
    • 评论:928条
    我的开源项目
    最新评论