加入收藏 | 设为首页 | 会员中心 | 我要投稿 湖南网 (https://www.hunanwang.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 创业 > 正文

EXTJS4官方文档翻译系列一:类系统和编码规范

发布时间:2018-11-06 05:44:26 所属栏目:创业 来源:站长网
导读:EXTJS4官方文档翻译系列一:类体系和编码类型,转载自《学而知不敷》的技能博客,原文如下: 上个星期开始行使extjs4,之前都没用过ext,以是此刻只好全力的柯寄档了,趁便记下来停止往后健忘.括号中内容是我本身添加的备注可能原文.英语较量烂,但不想一向烂

这个要领很轻易从现有的类中担任建设新的类.对比直接担任,我们没有好用的API用于类建设的其他方面,诸如:设置、静态要领、混入(Mixins)。呆会我们再来具体的从头审阅这些方面。此刻,让我们来看看另一个例子:

   1: My.cool.Window = Ext.extend(Ext.Window, { ... });

 

 

在这个例子中,我们建设我们的新类,担任Ext.Window,放在定名空间中。我们有两个题目要办理:

1,在我们会见My.cool的Window属性之前,My.cool必需是一个已有的工具.

2,Ext.Window必需在引用之前加载.

第一个题目凡是行使Ext.namespace(别名Ext.ns)来办理.该要领递归建设(假如该工具不存在)这些工具依靠.较量繁琐死板的部门是你必需在Ext.extend之前执行Ext.ns来建设它们.

   1: Ext.ns('My.cool');
   2: My.cool.Window = Ext.extend(Ext.Window, { ... });

第二个题目欠好办理,由于Ext.Window也许直接或间接的依靠于很多其他的类,依靠的类也许还依靠其余类...出于这个缘故起因,在ext4之前,我们凡是引入整个ext-all.js,纵然是我们只必要个中的一小部门.

1.2) 新的方法

在Extjs4中,你只必要行使一个要领就可以办理这些题目:Ext.define.以下是它的根基语法:

   1: Ext.define(className, members, onClassCreated);
  • className: 类名
  • members:代表类成员的工具字面量(键值对,json)

    onClassCreated: 可选的回调函数,在全部依靠都加载完毕,而且类自己成立后触发.因为类建设的新的异步特征,这个回调函数在许多环境下都很有效.这些在第四节中将进一步接头

    譬喻:

       1: Ext.define('My.sample.Person', {
       2:     name: 'Unknown',
       3:  
       4:     constructor: function(name) {
       5:         if (name) {
       6:             this.name = name;
       7:         }
       8:  
       9:         return this;
      10:     },
      11:  
      12:     eat: function(foodType) {
      13:         alert(this.name + " is eating: " + foodType);
      14:  
      15:         return this;
      16:     }
      17: });
      18:  
      19: var aaron = Ext.create('My.sample.Person', 'Aaron');
      20:     aaron.eat("Salad"); // alert("Aaron is eating: Salad");

    留意我们行使Ext.create()要领建设了My.sample.Person类的一个新实例.我们也可以行使新的要害字(new My.sample.Person())来建设.然而,提议养成始终用Ext.create来建设类示例的风俗,由于它应承你操作动态加载的上风.更多关于动态加载信息,请看入门指南:入门指南

    2).设置

    在ExtJS 4 ,我们引入了一个专门的设置属性,用于提供在类建设前的预处理赏罚成果.特征包罗:

  • 设置完全封装其他类成员
  • getter和setter.假如类没有界嗣魅这些要领,在建设类时将自动天生设置的属性的getter和setter要领。
  • 同样的,每个设置的属性自动天生一个apply要领.自动天生的setter要领内部在配置值之前挪用apply要领.假如你要在配置值之前自界说本身的逻辑,那就重载apply要领.假如apply没有返回值,则setter不会配置值.看下面applyTitle的例子:
       1: Ext.define('My.own.Window', {
       2:    /** @readonly */
       3:     isWindow: true,
       4:  
       5:     config: {
       6:         title: 'Title Here',
       7:  
       8:         bottomBar: {
       9:             enabled: true,
      10:             height: 50,
      11:             resizable: false
      12:         }
      13:     },
      14:  
      15:     constructor: function(config) {
      16:         this.initConfig(config);
      17:  
      18:         return this;
      19:     },
      20:  
      21:     applyTitle: function(title) {
      22:         if (!Ext.isString(title) || title.length === 0) {
      23:             alert('Error: Title must be a valid non-empty string');
      24:         }
      25:         else {
      26:             return title;
      27:         }
      28:     },
      29:  
      30:     applyBottomBar: function(bottomBar) {
      31:         if (bottomBar && bottomBar.enabled) {
      32:             if (!this.bottomBar) {
      33:                 return Ext.create('My.own.WindowBottomBar', bottomBar);
      34:             }
      35:             else {
      36:                 this.bottomBar.setConfig(bottomBar);
      37:             }
      38:         }
      39:     }
      40: });

    以下是它的用法:

       1: var myWindow = Ext.create('My.own.Window', {
       2:     title: 'Hello World',
       3:     bottomBar: {
       4:         height: 60
       5:     }
       6: });
       7:  
       8: alert(myWindow.getTitle()); // alerts "Hello World"
       9:  
      10: myWindow.setTitle('Something New');
      11:  
      12: alert(myWindow.getTitle()); // alerts "Something New"
      13:  
      14: myWindow.setTitle(null); // alerts "Error: Title must be a valid non-empty string"
      15:  
      16: myWindow.setBottomBar({ height: 100 }); // Bottom bar's height is changed to 100

    3.Statics

    (编辑:湖南网)

    【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

  • 热点阅读