`
禹爸爸
  • 浏览: 87458 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Ext学习笔记二(类定义)

ext 
阅读更多

在Ext中使用如下语句便可以定义一个类,

 

  1. Person=Ext.emptyFn;

当然这样定义的类只是一个空架子,没有任何属性和方法,使用下面的代码为其添加属性和方法

 

  1. Ext.apply(Person.prototype,{
  2. name:"ChrisMao",//自定义属性
  3. print:function(){//自定义方法
  4. alert(this.name);
  5. }
  6. });

使用命名空间
熟悉面向对象编程的朋友都了解命名空间这个概念,Ext同样支持命名空间。

 

  1. Ext.namespace("Ext.Emerson");//定义命名空间
  2. Ext.Emerson.Person=Ext.emptyFn;
  3. Ext.apply(Ext.Emerson.Person.prototype,{
  4. name:"ChrisMao",//自定义属性
  5. print:function(){//自定义方法
  6. alert(this.name);
  7. }
  8. });

使用示例:

  1. <html>
  2. <head>
  3. <linkrel="stylesheet"type="text/css"href="http://plt385130:8080/ext-2.2/resources/css/ext-all.css"/>
  4. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/adapter/ext/ext-base.js"></script>
  5. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/ext-all.js"></script>
  6. <scripttype="text/javascript"src="Person.js"></script>
  7. <scripttype="text/javascript">
  8. varp=newExt.Emerson.Person();
  9. p.name='ChrisMao';//属性赋值
  10. p.print();//调用print()方法
  11. </script>
  12. </head>
  13. <body>
  14. </body>
  15. </html>

定义构造函数

  1. Ext.namespace("Ext.Emerson");//定义命名空间
  2. Ext.Emerson.Person=function(_cfg){
  3. //dosomething
  4. Ext.apply(this,_cfg);
  5. };
  6. Ext.apply(Ext.Emerson.Person.prototype,{
  7. print:function(){//自定义方法
  8. alert(this.name);
  9. }
  10. });

使用示例

  1. <html>
  2. <head>
  3. <linkrel="stylesheet"type="text/css"href="http://plt385130:8080/ext-2.2/resources/css/ext-all.css"/>
  4. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/adapter/ext/ext-base.js"></script>
  5. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/ext-all.js"></script>
  6. <scripttype="text/javascript"src="Person.js"></script>
  7. <scripttype="text/javascript">
  8. varp=newExt.Emerson.Person({name:"ChrisMao"});
  9. p.print();//调用print()方法
  10. </script>
  11. </head>
  12. <body>
  13. </body>
  14. </html>


定义类静态方法

  1. Ext.Emerson.Person.print=function(_name){
  2. varp=newExt.Emerson.Person();
  3. p.name=_name;
  4. p.print();
  5. }

使用示例

  1. <html>
  2. <head>
  3. <linkrel="stylesheet"type="text/css"href="http://plt385130:8080/ext-2.2/resources/css/ext-all.css"/>
  4. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/adapter/ext/ext-base.js"></script>
  5. <scripttype="text/javascript"src="http://plt385130:8080/ext-2.2/ext-all.js"></script>
  6. <scripttype="text/javascript"src="Person.js"></script>
  7. <scripttype="text/javascript">
  8. varp=newExt.Emerson.Person();
  9. //调用静态方法
  10. Ext.Emerson.Person.print('毛子兵');
  11. </script>
  12. </head>
  13. <body>
  14. </body>
  15. </html>

类继承

定义一个Student类,继承于Person类,并添加了Job属性。

  1. Ext.Emerson.Student=function(_cfg){
  2. //dosomething
  3. Ext.apply(this,_cfg);
  4. };
  5. Ext.extend(Ext.Emerson.Student,Ext.Emerson.Person,{job:"学生"});

 

版权声明:本文为博主原创文章,未经博主允许不得转载。

分享到:
评论

相关推荐

    EXT学习笔记-项目应用实践

    这篇EXT学习笔记主要涵盖了EXTJS中面向对象编程的一些关键概念和实践,包括命名空间、类定义、构造函数、属性与方法的访问控制(私有和公有)、静态属性与方法以及继承机制。 1. **命名空间**:在EXTJS中,命名空间...

    ext学习资料 20篇详细学习笔记 初学者ext学习的文档

    这份"ext学习资料 20篇详细学习笔记 初学者ext学习的文档"是针对EXT初学者的一份宝贵资源,旨在帮助初学者快速入门EXT开发。 EXT的学习通常包括以下几个核心部分: 1. **EXT基础**:首先,你需要了解EXT的基本概念...

    Gwt-ext学习笔记之基础篇

    ### Gwt-ext学习笔记之基础篇 #### 一、安装CypalStudio工具 为了能够开始Gwt-ext的学习之旅,首先需要确保开发环境已经搭建好。CypalStudio是一款非常实用的工具,它能帮助开发者更高效地进行GWT项目的开发。 1....

    Gwt-ext学习笔记

    ### Gwt-ext学习笔记知识点详解 #### 一、Gwt-ext简介与安装 Gwt-ext是一种基于Google Web Toolkit(GWT)的高级用户界面库,它提供了丰富的UI组件和功能,使得开发高质量的Web应用程序变得更加容易。对于初学者而...

    十分有用有帮助的EXT学习笔记

    以下是对EXT学习笔记中涉及的关键知识点的详细说明: 1. **EXT Form**: EXT中的表单组件是构建用户交互界面的重要部分。它们允许用户输入数据并将其提交到服务器。EXT Form支持多种字段类型,如文本框、选择框、...

    Gwt-Ext学习笔记之进级篇

    在GWT-Ext的学习过程中,首先你需要了解如何定义和实现远程服务。这是GWT的一个核心特性,它允许客户端和服务器之间的安全通信。在GWT中,远程服务调用通常涉及以下几部分: 1. **远程服务接口(Remote Service ...

    Ext学习笔记-个人版.doc

    `allowBlank:false`表示字段不能为空,`blankText`则定义了当字段为空时显示的错误信息。 在Ext中,属性表格通常使用`PropertyGrid`实现,它可以展示数据的键值对,方便用户查看和编辑。界面布局可以通过`...

    ext 4.0 学习笔记.doc

    EXT 4.0 是一款流行的JavaScript库,专门用于构建富...EXT 4.0提供了丰富的API文档,允许开发者深入学习并自定义更多功能,如分页、筛选、编辑等。对于初学者来说,了解和实践这些基本概念是掌握EXT 4.0的第一步。

    ext 学习笔记

    `Ext.data.Store`是Ext JS中的核心类之一,用于管理和处理应用程序中的数据。`employeestore`的配置展示了如何创建一个数据存储,并通过`reader`解析服务器返回的JSON数据。`url:path+'/user/findByPersoList.do'`...

    java之jvm学习笔记五(实践写自己的类装载器)

    这个“java之jvm学习笔记五(实践写自己的类装载器)”很可能是对这一主题的详细探讨。 类装载器在Java中的主要职责是动态加载类到JVM中。Java的类装载器分为三个基本层次:启动类装载器(Bootstrap ClassLoader)、...

    【ASP.NET编程知识】Ext.Net学习笔记之button小结.docx

    在ASP.NET编程中,Ext.Net是一个强大的客户端框架,它提供了丰富的UI组件,使得开发者能够创建交互性强、用户体验良好的Web应用程序。本篇文档主要总结了关于Ext.Net中的button组件的一些关键知识点,包括触发客户端...

    GRUB学习笔记(教程)

    ### GRUB学习笔记知识点梳理 #### 一、GRUB基础 **1.1 GRUB简介** - **定义**: GRUB(Grand Unified Bootloader)是一种通用的启动加载程序,它的主要功能是在计算机启动过程中加载并传递控制权给操作系统的核心...

    深入Java虚拟机JVM类加载学习笔记

    ### 深入Java虚拟机JVM类加载学习笔记 #### 一、Classloader机制解析 在Java虚拟机(JVM)中,类加载器(ClassLoader)是负责将类的`.class`文件加载到内存中的重要组件。理解类加载器的工作原理对于深入掌握JVM以及...

    SQLAlchemy学习笔记1

    这篇“SQLAlchemy学习笔记1”可能涉及了初学者入门的一些核心概念,包括数据库配置、模型定义、会话管理以及基本的CRUD操作。 首先,SQLAlchemy的核心概念是`Engine`,它是与数据库进行通信的接口。通过配置连接...

    老师整理的extjs学习笔记

    ### ExtJS 学习笔记概览 #### 一、ExtJS 入门 **1.1 ExtJS 构成及如何引用** ExtJS 是一款基于 JavaScript 的开源框架,专为 Web 应用程序的前端界面设计。其核心优势在于提供了一套丰富的 UI 组件和强大的数据...

Global site tag (gtag.js) - Google Analytics