从今天起开始学习ExtJs，在这里记录一些学习笔记，方便日后查看，有兴趣的朋友欢迎共同探讨，也请老鸟们多多指教，如果我的理解有什么不正确的地方，也请大家帮助也改正，帮我指出一条明路，先在这里谢过了。
学习过程是看DojoChina的陈治文老师讲解的视频（感谢陈治文老师的辛勤工作，这里先赞一下），不是自己原创，边学习边做笔记，不能算是剽窃吧，朋友们别骂我不厚道。
先把文档放在手边，Ext在线文档：http://extjs.com/deploy/dev/docs/
---------------------------------------------------------------------------------------------------------------------------------
Here we go....
NameSpace
HTML文件中引入基本的三个Ext文件：
<link type="text/css" rel="stylesheet" href="ext/resources/css/ext-all.css">
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
这点和Dojo一样，Dojo中也是需要引用一个统一的风格的样式（Dojo中有两个常用的themes，soria和tundra），不知道Ext中是不是也提供多样的UI显示主题，简单看了一下resources/css目录下面似乎没有像Dojo一样分层明确的themes，应该是采用其他的方式来实现的。
另外引入两个Ext基本的JS，Ext基本功能的封装。
把定义NameSpace的JS写到一个单独的js文件中
/* 定义命名空间 */
Ext.namespace("com.meizhi");
/**
* 定义一个类
* 写法相当于com.meizhi.HelloWorld = new function() {};
*/
com.meizhi.HelloWorld = Ext.emptyFn;
然后就可以在通过new来创建HelloWorld类的一个实例
<script type="text/javascript">
new com.meizhi.HelloWorld();
</script>
OK，类的实例创建成功，当然，运行起来会没有任何反应，因为我们在类的定义中只给出了一个空的function。
看Ext是怎样实现NameSpace的，看源代码中的Ext.js
namespace : function(){
var a=arguments, o=null, i, j, d, rt;
for (i=0; i<a.length; ++i) {
d=a[i].split(".");
rt = d[0];
eval('if (typeof ' + rt + ' == "undefined"){' + rt + ' = {};} o = ' + rt + ';');
for (j=1; j<d.length; ++j) {
o[d[j]]=o[d[j]] || {};
o=o[d[j]];
}
}
},
...............
Ext.ns = Ext.namespace;
...............
Ext.ns("Ext", "Ext.util", "Ext.grid", "Ext.dd", "Ext.tree", "Ext.data",
"Ext.form", "Ext.menu", "Ext.state", "Ext.lib", "Ext.layout", "Ext.app", "Ext.ux");
通过arguments得到namespace方法的参数，然后用点号分割成数组，再依次把空对象递归赋值进去，这样Ext实现NameSpace的过程，而用点号进行连接，实际上就是对象的嵌套。
程序通过命名空间可以具有很好的组织形式，在java中命名空间的形式是通过package来实现的，Ext命名空间实际上是使用JavaScript的对象和对象属性级联来模拟的，和java的命名空间实现方式是不同的。将Ext的NameSpace用java的package来理解就容易多了。
命名空间别名
举例：
Mz = com.meizhi;
要求首字母必须大写，其他字母小写。
实际上就是通常命名空间是一个比较长的字符串，用一个缩写来代替。
Ext.namespace("com.meizhi");
//命名空间别名
Mz = com.meizhi;
Mz.HelloWorld = Ext.emptyFn;
类别名
举例
HW = com.meizhi.HelloWorld
要求别名全部大写，用来区别NameSpace的别名。
别名用的情况不是很多，在读别人的代码的时候能够看明白是怎么回事就好了。
类实例属性
“类实例”感觉怪怪的，还是按照java中的概念来理解一下，java中类的一个实例，其实就是一个对象，java是面向对象的语言，Ext是用JavaScript实现的面向对象（这样的说法不是很严谨，意会一下），那么这里的“类实例”其实就是我们通常所说的“对象”。
那么“类实例属性”，其实也就是对象的属性。
来看一下类实例属性的创建：
Ext.namespace("com.meizhi");
com.meizhi.Person = Ext.emptyFn;
Ext.apply(com.meizhi.Person.prototype,{
name:"meizhi
",
sex:"男"
});
prototype
是JavaScript中的函数原型，apply
方法是JavaScript中提供的对象绑定的方法（JavaScript中常用的对象绑定方法有两种：apply和call），Ext.apply是对JavaScript提供的apply方法进行了一层封装，方便使用，如果不了解的朋友可以先自己查一下相关的资料（参考：http://virgos.iteye.com/blog/222199
），这里不做赘述。
来看一下调用：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>NameSpace</title>
<link type="text/css" rel="stylesheet" href="ext/resources/css/ext-all.css">
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript" src="js/helloworld.js"></script>
<script type="text/javascript">
var _person = new com.meizhi.Person();
alert(_person.name);
_person.name = "陈治文";
alert(_person.name);
</script>
</head>
<body>
</body>
</html>
结果：当进入页面的时候，会弹出对话框，内容是“meizhi
”，点击确定以后又弹出对话框，内容是“陈治文”。这是因为在创建类Person的时候，创建了name属性，并赋给它一个默认值“
meizhi
”，
在调用的时候我们更改了_person对象的name属性，并赋值“陈治文”，这样两次alert的结果就不相同了。
这里给对象属性赋值操作体现了JavaScript的特性，在Java中我们如果在给对象属性取值和赋值的时候，都是会用到getters和setters方法（每个POJO中都会有一大堆的属性，然后用eclipse自动生成一大堆的getters和setters方法），而JavaScript的处理方式更加灵活，当然，这两种方式各有利弊，需要在其中找到一个平衡点。
类实例方法
理解了Ext的类实例属性，那么类实例方法就好理解了，就是类里面的一个方法。
Ext.namespace("com.meizhi");
com.meizhi.Person = Ext.emptyFn;
Ext.apply(com.meizhi.Person.prototype,{
name:"",
sex:"",
print:function(){
alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
});
"String.format"是Ext封装的一个字符串处理方法，在Ext中有很多类似的工具方法（这一点Dojo中也是这样做的，似乎框架中都会封装一些常用的工具方法，方便使用）。
"String.format"方法中的参数格式，写法很方便，不用做繁琐的字段拼接。
上面代码中Person类中定义了两个类实例属性name和sex，并且它们的默认值为空，在构造Person对象实例的时候可以为它们进行赋值操作。提供了一个类实例方法，将属性输出。
现在的代码就有点儿像java中的类了，呵呵
来看调用：
<script type="text/javascript">
var person = new com.meizhi.Person();
//设置属性
person.name = "meizhi
";
person.sex = "男";
//调用方法
person.print();
//为该对象再次设置属性
person.name = "Katrana";
person.sex = "女";
person.print();
</script>
可以看到弹出对话框中显示：“姓名：meizhi
，性别：男”和“姓名：Katrana，性别：女”，是经过格式化以后的文本输出样式，也就是类实例方法中定义的样式，从这里也可以看到Ext封装的"String.format"方法的使用效果。
类静态方法
定义:在一个类级别上的共享方法。
来看定义
Ext.namespace("com.meizhi");
com.meizhi.Person = Ext.emptyFn;
//这里定义的 print方法 是 类实例方法
Ext.apply(com.meizhi.Person.prototype,{
name:"",
sex:"",
print:function(){
alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
});
//这里定义的 print方法 是 类静态方法
com.meizhi.Person.print = function(_name, _sex){
var _person = new com.meizhi.Person();
_person.name = _name;
_person.sex = _sex;
_person.print();
}
对照Java代码来看一下，理解的更快一些：
Person.print(String name, String sex) {
Person person = new Person();
person.setName(name);
person.setSex(sex);
person.print();
}
调用
<script type="text/javascript">
new com.meizhi.Person.print("meizhi","男");
new com.meizhi.Person.print("katrana","女");
</script>
调用的过程是 new com.meizhi.Person.print(name, sex)，而不是先new com.meizhi.Person()，在调用它的print()方法。构造对象的过程是在静态方法内部完成的，这里需要好好的体会一下。
结果和上面的例子是一样的。
两点多了，睡觉了，明天还要上班，今天先到这儿吧。
Ext学习笔记01 - NameSpace，类实例属性，类实例方法，类静态方法
Ext学习笔记02 - 构造方法，类继承，类实例方法重写
Ext学习笔记03 - 事件
Ext学习笔记04 - UI组件 - Component, Button
Ext学习笔记05 - UI组件 - Panel,TextField
Ext学习笔记06 - Window
Ext学习笔记07 - Window及Window中的布局
Ext学习笔记08 - 日期控件
Ext学习笔记09 - ComboBox
分享到：
相关推荐
这篇EXT学习笔记主要涵盖了EXTJS中面向对象编程的一些关键概念和实践，包括命名空间、类定义、构造函数、属性与方法的访问控制（私有和公有）、静态属性与方法以及继承机制。 1. **命名空间**：在EXTJS中，命名空间...
- 静态方法：直接在类上定义的方法，如`Person.println`，不依赖实例化对象即可调用。 - 构造方法：通过`Ext.roy.Person=function(_cfg)`定义，`Ext.apply(this, _cfg)`用于将传入的配置对象应用于实例。 - 继承...
### EXTJS学习笔记 #### 一、EXTJS基础概念与命名空间管理 **EXTJS** 是一款基于JavaScript的开源框架，主要用于开发复杂的企业级Web应用。它的设计目标是提高前端开发效率并简化复杂的用户界面（UI）开发过程。在...
嵌入式八股文面试题库资料知识宝典-华为的面试试题.zip
训练导控系统设计.pdf
嵌入式八股文面试题库资料知识宝典-网络编程.zip
人脸转正GAN模型的高效压缩.pdf
少儿编程scratch项目源代码文件案例素材-几何冲刺 转瞬即逝.zip
少儿编程scratch项目源代码文件案例素材-鸡蛋.zip
嵌入式系统_USB设备枚举与HID通信_CH559单片机USB主机键盘鼠标复合设备控制_基于CH559单片机的USB主机模式设备枚举与键盘鼠标数据收发系统支持复合设备识别与HID
嵌入式八股文面试题库资料知识宝典-linux常见面试题.zip
面向智慧工地的压力机在线数据的预警应用开发.pdf
基于Unity3D的鱼类运动行为可视化研究.pdf
少儿编程scratch项目源代码文件案例素材-霍格沃茨魔法学校.zip
少儿编程scratch项目源代码文件案例素材-金币冲刺.zip
内容概要：本文深入探讨了HarmonyOS编译构建子系统的作用及其技术细节。作为鸿蒙操作系统背后的关键技术之一，编译构建子系统通过GN和Ninja工具实现了高效的源代码到机器代码的转换，确保了系统的稳定性和性能优化。该系统不仅支持多系统版本构建、芯片厂商定制，还具备强大的调试与维护能力。其高效编译速度、灵活性和可扩展性使其在华为设备和其他智能终端中发挥了重要作用。文章还比较了HarmonyOS编译构建子系统与安卓和iOS编译系统的异同，并展望了其未来的发展趋势和技术演进方向。; 适合人群：对操作系统底层技术感兴趣的开发者、工程师和技术爱好者。; 使用场景及目标：①了解HarmonyOS编译构建子系统的基本概念和工作原理；②掌握其在不同设备上的应用和优化策略；③对比HarmonyOS与安卓、iOS编译系统的差异；④探索其未来发展方向和技术演进路径。; 其他说明：本文详细介绍了HarmonyOS编译构建子系统的架构设计、核心功能和实际应用案例，强调了其在万物互联时代的重要性和潜力。阅读时建议重点关注编译构建子系统的独特优势及其对鸿蒙生态系统的深远影响。
嵌入式八股文面试题库资料知识宝典-奇虎360 2015校园招聘C++研发工程师笔试题.zip
嵌入式八股文面试题库资料知识宝典-腾讯2014校园招聘C语言笔试题（附答案）.zip
双种群变异策略改进RWCE算法优化换热网络.pdf
内容概要：本文详细介绍了基于瞬时无功功率理论的三电平有源电力滤波器（APF）仿真研究。主要内容涵盖并联型APF的工作原理、三相三电平NPC结构、谐波检测方法（ipiq）、双闭环控制策略（电压外环+电流内环PI控制）以及SVPWM矢量调制技术。仿真结果显示，在APF投入前后，电网电流THD从21.9%降至3.77%，显著提高了电能质量。 适用人群：从事电力系统研究、电力电子技术开发的专业人士，尤其是对有源电力滤波器及其仿真感兴趣的工程师和技术人员。 使用场景及目标：适用于需要解决电力系统中谐波污染和无功补偿问题的研究项目。目标是通过仿真验证APF的有效性和可行性，优化电力系统的电能质量。 其他说明：文中提到的仿真模型涉及多个关键模块，如三相交流电压模块、非线性负载、信号采集模块、LC滤波器模块等，这些模块的设计和协同工作对于实现良好的谐波抑制和无功补偿至关重要。