`
禹爸爸
  • 浏览: 86535 次
  • 性别: 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");//定义命名空间
  3. Ext.Emerson.Person=Ext.emptyFn;
  5. Ext.apply(Ext.Emerson.Person.prototype,{
  6. name:"ChrisMao",//自定义属性
  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();
  9. p.name='ChrisMao';//属性赋值
  10. p.print();//调用print()方法
  11. </script>
  12. </head>
  13. <body>
  14. </body>
  15. </html>

定义构造函数

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

使用示例

  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();
  10. //调用静态方法
  11. Ext.Emerson.Person.print('毛子兵');
  12. </script>
  13. </head>
  14. <body>
  15. </body>
  16. </html>

类继承

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

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

 

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

分享到：
| Ext学习笔记一（使用Ext.Panel创建一个登 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    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组件的一些关键知识点，包括触发客户端...

    深入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 组件和强大的数据...

Magicbox
Global site tag (gtag.js) - Google Analytics