Ext.namespace

最新推荐文章于 2017-11-01 15:43:29 发布
最新推荐文章于 2017-11-01 15:43:29 发布
阅读量624 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/wangbaojian_good/article/details/8742958
本文详细介绍了使用ExtJS进行高效编程的各种高级技巧，包括命名空间的定义与使用、类实例属性与方法的设置、静态方法的实现、构造方法的定义、类继承与方法重写，以及如何使用别名和类别名简化代码。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1：支持命名空间
 
1
2
3
4
5
6
7
8
9
<script type="text/javascript">
    //定义一个命名空间
    Ext.namespace("Ext.baojian");
    //在命名空间上定义一个类
    Ext.baojian.helloworld = Ext.emptyFn;
      
    //创建一个类的实例
    newExt.baojian.helloworld();       
</script>
 其中 Ext.baojian.helloworld = Ext.emptyFn; 等价于 Ext.baojian.helloworld = function(){};

2：支持类实例属性
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
    Ext.baojian.Person = Ext.emptyFn;//在命名空间上自定义一个类
  
    //为自定义的类 增加一个 name 属性，并赋值
    Ext.apply(Ext.baojian.Person.prototype, {
        name:"王宝健"
    })
      
    var_person =newExt.baojian.Person();//实例化 自定义类
    alert(_person.name);
    _person.name ="杨波";//修改类name属性
    alert(_person.name);
</script>
3：支持类实例方法
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
    Ext.baojian.Person = Ext.emptyFn;//在命名空间上自定义一个类
  
    //演示类实例方法
    Ext.apply(Ext.baojian.Person.prototype, {
        name:"王宝健",
        sex:"男",
        print:function(){
            alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
        }
    })
  
    var_person =newExt.baojian.Person();//实例化 自定义类
    _person.print();
</script>
4：支持类静态方法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
    Ext.baojian.Person = Ext.emptyFn;//在命名空间上自定义一个类
  
    //演示类实例方法
    Ext.apply(Ext.baojian.Person.prototype, {
        name:"王宝健",
        sex:"男",
        print:function(){
            alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
        }
    })
      
    //演示 类静态方法
    Ext.baojian.Person.print =function(_name,_sex){
        var_person =newExt.baojian.Person();
        _person.name = _name;
        _person.sex = _sex;
        _person.print();//此处调用类 实例方法，上面print是类 静态方法
    }
  
    Ext.wentao.Person.print("杨波","女");//调用类 静态方法
</script>

 
 
5：支持构造方法
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/javascript">
    Ext.namespace("Ext.wentao");//自定义一个命名空间
  
    //构造方法
    Ext.baojian.Person =function(_cfg){
        Ext.apply(this,_cfg);
    }
  
    //演示类实例方法
    Ext.apply(Ext.baojian.Person.prototype, {
        print:function(){
            alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
        }
    })
      
    //演示 类静态方法
    Ext.baojian.Person.print =function(_name,_sex){
        var_person =newExt.baojian.Person({name:_name,sex:_sex});
        _person.print();//此处调用类 实例方法，上面print是类 静态方法
    }
  
    Ext.baojian.Person.print("杨波","女");//调用类 静态方法
</script>

6：支持类继承

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
  
    //*******************父类*********************
    //构造方法
    Ext.wentao.Person =function(_cfg){
        Ext.apply(this,_cfg);
    }
  
    //演示类实例方法
    Ext.apply(Ext.baojian.Person.prototype, {
        job:"无",
        print:function(){
            alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));
        }
    })
  
    //*******************子类1*********************
  
    Ext.baojian.Student =function(_cfg){
      Ext.apply(this,_cfg);
    }
  
   Ext.extend(Ext.baojian.Student,Ext.baojian.Person,{
       job:"上班族"
   })
  
    var_student =newExt.baojian.Student({name:"杨波",sex:"女"});
   _student.print();//调用 父类方法
</script>

7：支持类实例方法重写

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
  
    //*******************父类*********************
    //构造方法
    Ext.wentao.Person =function(_cfg){
        Ext.apply(this,_cfg);
    }
  
    //演示类实例方法
    Ext.apply(Ext.baojian.Person.prototype, {
        job:"无",
        print:function(){
            alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));
        }
    })
  
    //*******************子类1*********************
  
    Ext.wentao.Student =function(_cfg){
      Ext.apply(this,_cfg);
    }
  
    //重写父类的  实例 方法
   Ext.extend(Ext.baojian.Student,Ext.baojian.Person,{
       job:"上班族",
        print:function(){
            alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
        }
   })
  
    var_student =newExt.baojian.Student({name:"杨波",sex:"女"});
   _student.print();//调用 父类方法
</script>

8：支持命名空间别名
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
  
    Bj = Ext.wentao;//命名空间的别名
  
    //*******************父类*********************
    //构造方法
    Wt.Person =function(_cfg){
        Ext.apply(this,_cfg);
    }
  
    //演示类实例方法
    Ext.apply(Bj.Person.prototype, {
        job:"无",
        print:function(){
            alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));
        }
    })
  
    //*******************子类1*********************
  
    Wt.Student =function(_cfg){
      Ext.apply(this,_cfg);
    }
  
    //重写父类的  实例 方法
   Ext.extend(Bj.Student,Ext.baojian.Person,{
       job:"学生",
        print:function(){
            alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
        }
   })
  
    var_student =newBj.Student({name:"杨波",sex:"女"});
   _student.print();//调用 父类方法
</script>

9：支持类别名
 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<script type="text/javascript">
    Ext.namespace("Ext.baojian");//自定义一个命名空间
  
    Bj = Ext.baojian;//命名空间的别名
  
    //*******************父类*********************
    //构造方法
     Bj.Person =function(_cfg){
        Ext.apply(this,_cfg);
    }
  
    PN = Bj.Person;//类别名
  
    //演示类实例方法
    Ext.apply(PN.prototype, {
        job:"无",
        print:function(){
            alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));
        }
    })
  
    //*******************子类1*********************
  
     Bj.Student =function(_cfg){
      Ext.apply(this,_cfg);
    }
  
    ST = Bj.Student;
  
    //重写父类的  实例 方法
   Ext.extend(ST,PN,{
       job:"上班族",
        print:function(){
            alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
        }
   })
  
    var_student =newST({name:"杨波",sex:"女"});
   _student.print();//调用 父类方法
</script>

Ext.namespace解析
一直向上
03-29 229
对于这个函数，我一直不太清楚，今天查了查官方的解释，豁然开朗。 对于java中的包，我们都认为主要是为了类名重复而引入的一种管理类的方法。同样，因为js定义的类太多，难免会定义重复的类名。特别是在今天这个需要共同协作完成项目的世界里。Ext.namespace正是为此而生。 Ext.namespace('com.company'); 就是定义了一个com.company的包。 ...
Ext.namespace 命名空间的解析
weixin_30896511的博客
08-02 176
之前做项目看Ext3.x的时候，觉得会用就好了，没有深入去理解。最近研究Sencha又遇到这个疑惑。于是上网搜了很多相关的资料，在此总结一下。 1. Ext.namespace方法,该方法的作用是把传入的参数转换成对象.使用该方法的目的主要在于可以区分类名相同的类,这有点和java中的package作用类似.让我们先看下源码: 1 namespace : function(){ 2 ...
关于 extjs 的 namespace
allin01的专栏
07-27 1726
          命名空间(namespace)是Extjs组织代码的一个非常精巧的方式。通过这一方式，可以将数量庞大的js代码分类到不同的命名空间下，可以有效地解决js容易产生变量冲突的问题，让不同命名空间下的变量和对象的取名更自由而不受同名的约束。下面看看命名空间应用的例子：         Ext.namespace("App.common.util"); App.common.util.MyFormValidater = function(){
Ext入门学习.docx
11-21
ExtJS 中的面向对象编程是通过 Ext.namespace() 函数来实现的，例如 Ext.namespace("Ext.cc");。 ExtJS 中的类继承是通过 prototype 属性来实现的，例如 Ext.cc.Class2.prototype = new Ext.cc.Class1();。 ExtJS 中...
nacos.namespace
最新发布
04-19
好的，用户想了解Nacos中namespace的使用和配置方法。之前已经提供了一份详细的指南，现在需要根据用户的问题和提供的引用资料来整理一个更贴合的回答。首先，我需要确认用户的需求，他们可能是在实际项目中需要配置...
Ext.js自定义事件实战攻略：创建高效事件管理系统
本文首先介绍了Ext.js框架和事件驱动编程的基本概念，随后深入探讨了Ext.js的事件系统，包括事件监听、触发机制、核心处理方法和事件对象详解。接着，文章着重讲解了自定义事件的创建与管理，事件命名空间和作用域的...
避免陷阱：Ext.js事件异常处理与调试的高级技巧
![避免陷阱：Ext.js事件异常处理与调试的高级技巧]...本文针对Ext.js框架中的事件处理机制进行了系统性的探讨。第一章介绍了Ext.js事件处理的基础知识，为后续章节的深入分析打下基础。第
Ext_命名空间_Ext.namespace
66
04-12 1203
创建指定命名空间，可以在该命名空间下定义变量，方法，类，避免冲突 //定义2个命名空间Ext.namespace(my.namespace1,my.namespace2);//在命名空间my.namespace1下说明函数myFun1my.namespace1.myFun1 = function(){ //函数体}//在命名空间my.nam
Ext.namespace() Ext命名空间介绍
weixin_30649859的博客
06-26 134
Ext.namespace() Ext命名空间介绍1：支持命名空间<script type="text/javascript"> //定义一个命名空间 Ext.namespace("Ext.wentao"); //在命名空间上定义一个类 Ext.wentao.helloworld = Ext.emptyFn; //创建一个类的实例 new...
Ext中namespace的作用
hintcnuie
12-07 188
Ext中在每一个页面中添加一个namespace呢，就像下面的代码：   // create namespace   Ext.namespace('myNameSpace');       // create application   myNameSpace.app = function() {       // do NOT access D...
ExtJS Ext.namespace详解
liusu
11-12 508
Ext.namespace的作用是Creates namespaces to be used for scoping variables and classes so that they are not global。 具体的创建代码很简单，我开始不理解，因为没有看到任何return语句，创建的package不知道怎么可以被引用到。阅读源码解惑： [code="javascript"]...
关于 Extjs 的 namespace
sandaray的专栏
11-23 443
命名空间(namespace)是Extjs组织代码的一个非常精巧的方式。通过这一方式，可以将数量庞大的js代码分类到不同的命名空间下，可以有效地解决js容易产生变量冲突的问题，让不同命名空间下的变量和对象的取名更自由而不受同名的约束。下面看看命名空间应用的例子：   Ext.namespace("App.common.util");      App.common.u
关于 Ext.ns 说明
蜗牛天堂
03-22 3279
基本知识 Ext.ns()（或Ext.namespace()函数）。 这个函数用以构建一个新的命名空间。 概念跟C#的命名空间或Java中的包概念一样。 观察源代码我们可以发现。 实际上这个函数只是建立了一个跟命名空间一样的类而已。 比如：Ext.ns('buzz.data.utility');，就会新建一个类，名称是buzz.data.utility。有了这个概念，我们就好办了。
JS命名空间（namespace）
geyalan的专栏
08-26 985
命名空间namespace（某些语言中叫package），是一个在静态语言中常见的概念。它可以帮助我们更好地整理代码，并可避免命名冲突。 举一个简单的例子，如果有两个人都叫小明，我们很难区分和引用这两个人。但如果我们在他们前面加上命名空间，比如：北京的小明和上海的小明，那么区分起来就容易的多了，也不会因为重名而找错人了。 遗憾的是，JS中并不提供原生的命名空间支持。在JS中创建的任何对象都默认
Ext(5)——namespace、js的公私有方法和属性
zylzb的专栏
10-27 1061
Ext的namespace和java的namespace是同一个概念。Ext在对类进行定义的时候如果先前的包是不存在的则不能进行类定义。 具体说明在代码中都有注释。     代码如下：   04_namespace.html --> Ext.onReady(fun
javaweb工程中图片的显示
wangbaojian_good的专栏
11-01 4916
最近在项目中需要实现一个功能，门户网站上显示用户上传的头像，其实就是文件的上传与显示，这里只说头像的显示问题，通过网上查资料发现有两种实现方式，总结下来，自己备用，也分享给朋友。      第一种情况，如果照片就在工程里边，那么可以通过链接直接访问到：            如图所示，我的照片文件所在的路径为：WebContent/image/tx_deafult.png，那么在页面上的访
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值