1：支持命名空间
<script type="text/javascript">
//定义一个命名空间
Ext.namespace("Ext.wentao");
//在命名空间上定义一个类
Ext.wentao.helloworld = Ext.emptyFn;
//创建一个类的实例
new Ext.wentao.helloworld();
</script>
其中
Ext.wentao.helloworld = Ext.emptyFn;
等价于
Ext.wentao.helloworld = function(){};
2：支持类实例属性
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类
//为自定义的类 增加一个 name 属性，并赋值
Ext.apply(Ext.wentao.Person.prototype, {
name:"刘文涛"
})
var _person = new Ext.wentao.Person();//实例化 自定义类
alert(_person.name);
_person.name = "张三";//修改类name属性
alert(_person.name);
</script>
3：支持类实例方法
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类
//演示类实例方法
Ext.apply(Ext.wentao.Person.prototype, {
name:"刘文涛",
sex:"男",
print:function(){
alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
})
var _person = new Ext.wentao.Person();//实例化 自定义类
_person.print();
</script>
4：支持类静态方法
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类
//演示类实例方法
Ext.apply(Ext.wentao.Person.prototype, {
name:"刘文涛",
sex:"男",
print:function(){
alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
})
//演示 类静态方法
Ext.wentao.Person.print = function(_name,_sex){
var _person = new Ext.wentao.Person();
_person.name = _name;
_person.sex = _sex;
_person.print(); //此处调用类 实例方法，上面print是类 静态方法
}
Ext.wentao.Person.print("张三","女"); //调用类 静态方法
</script>
5：支持构造方法
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
//构造方法
Ext.wentao.Person = function(_cfg){
Ext.apply(this,_cfg);
}
//演示类实例方法
Ext.apply(Ext.wentao.Person.prototype, {
print:function(){
alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
})
//演示 类静态方法
Ext.wentao.Person.print = function(_name,_sex){
var _person = new Ext.wentao.Person({name:_name,sex:_sex});
_person.print(); //此处调用类 实例方法，上面print是类 静态方法
}
Ext.wentao.Person.print("张三","女"); //调用类 静态方法
</script>
6：支持类继承
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
//*******************父类*********************
//构造方法
Ext.wentao.Person = function(_cfg){
Ext.apply(this,_cfg);
}
//演示类实例方法
Ext.apply(Ext.wentao.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.wentao.Student,Ext.wentao.Person,{
job:"学生"
})
var _student = new Ext.wentao.Student({name:"张三",sex:"女"});
_student.print(); //调用 父类方法
</script>
7：支持类实例方法重写
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
//*******************父类*********************
//构造方法
Ext.wentao.Person = function(_cfg){
Ext.apply(this,_cfg);
}
//演示类实例方法
Ext.apply(Ext.wentao.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.wentao.Student,Ext.wentao.Person,{
job:"学生",
print:function(){
alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
}
})
var _student = new Ext.wentao.Student({name:"张三",sex:"女"});
_student.print(); //调用 父类方法
</script>
8：支持命名空间别名
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
Wt = Ext.wentao; //命名空间的别名
//*******************父类*********************
//构造方法
Wt.Person = function(_cfg){
Ext.apply(this,_cfg);
}
//演示类实例方法
Ext.apply(Wt.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(Wt.Student,Ext.wentao.Person,{
job:"学生",
print:function(){
alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
}
})
var _student = new Wt.Student({name:"张q三",sex:"女"});
_student.print(); //调用 父类方法
</script>
9：支持类别名
<script type="text/javascript">
Ext.namespace("Ext.wentao"); //自定义一个命名空间
Wt = Ext.wentao; //命名空间的别名
//*******************父类*********************
//构造方法
Wt.Person = function(_cfg){
Ext.apply(this,_cfg);
}
PN = Wt.Person; //类别名
//演示类实例方法
Ext.apply(PN.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);
}
ST = Wt.Student;
//重写父类的 实例 方法
Ext.extend(ST,PN,{
job:"学生",
print:function(){
alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));
}
})
var _student = new ST({name:"张q三",sex:"女"});
_student.print(); //调用 父类方法
</script>
分享到：
相关推荐
根据提供的文件信息，可以看出主题是关于ExtJS框架与面向对象编程的实现方式。然而，由于提供的部分内容似乎并不完整且存在一些非标准字符，这给直接提取有用信息带来了困难。因此，我们将基于标题、描述和标签中的...
EXTJS 面向对象编程教程 EXTJS 是一个基于 JavaScript 的富客户端框架，它提供了强大的组件模型和面向对象的编程方式，使得开发者能够构建复杂的 Web 应用程序。面向对象编程（Object-Oriented Programming, OOP）...
总结一下，这个示例展示了以下ExtJS面向对象开发的关键点： 1. **继承与扩展**：`PersonListGridPanel` 类继承自 `Ext.grid.GridPanel`，增加了自己的特性。 2. **组件组合**：使用了GridPanel、FormPanel和Window...
"ExtJS培训sample_for面向对象设计"这个主题主要聚焦于如何在ExtJS中应用面向对象的设计原则和模式。 在面向对象设计中，有四个核心概念：封装、继承、多态和抽象。这些概念同样适用于JavaScript，因为JavaScript是...
这部分介绍ExtJS面向对象编程（OOP）的基础知识，包括JavaScript类的定义、ExtJS命名空间的使用、ExtJS的类继承、配置选项、以及ExtJS的实用工具函数如Ext.apply()和Ext.applyIf()。这些基础知识点是学习ExtJS的基石...
3. **ExtJs面向对象编程(OOP)** - ExtJs支持面向对象编程，包括封装、继承和多态性。 4. **配置选项** - 构件配置选项用于定义组件的行为和外观。 5. **Ext.apply()和Ext.applyIf()** - `Ext.apply()`用于合并...
本篇文章将探讨EXTJS框架中的面向对象机制，特别是继承的概念，以及如何在实际开发中应用这些概念。 EXTJS是一个强大的JavaScript库，它提供了丰富的UI组件和数据绑定功能，适用于构建复杂的Web应用程序。在EXTJS中...
EXTJS是一种基于JavaScript的客户端富...这些EXTJS面向对象编程的基础知识对于理解和编写高效、可维护的EXTJS代码至关重要。通过掌握这些概念，开发者可以更好地组织代码，利用EXTJS的强大功能创建复杂的Web应用程序。
它强调了JavaScript面向对象编程（OOP）在Extjs框架中的应用，并通过实例演示了如何使用各种组件和布局来创建复杂的用户界面。本教程通过递进式的结构，使读者从基础知识起步，逐步掌握Extjs的高级应用，最终能够...
ExtJs学习资料14-OOP[JavaScript面向对象编程]
如果你读过extjs的原代码，一定知道它是基于面向对象思想代码。该代码不同于extjs,更加合理且容易理解。
课程简介: ExtJS是一种主要用于创建前端用户界面，是一个基本与后台技术无关的前端ajax框架,本...第十九讲.ExtJS之组件面向对象编程（一） 第二十讲.ExtJS之组件面向对象编程（二） 项目实战Extjs版在线选课系统:
19、ExtJS之组件面向对象编程（一） 20、ExtJS之组件面向对象编程（一） 21、项目实战-需求分析、数据字典、数据库设计) r, `+ J( `$ l# d7 I$ h# W: U' r* a 22、项目实战-底层框架搭建、创建实体对象 23、项目实战...
Javascript 面向对象之非构造函数的继承 JavaScript对象与继承教程之内置对象（下） JavaScript对象及继承教程（上） javascript正则表达式(一) javascript正则表达式(二) JavaScript的10种跨域共享方法 JavaScript...
2. **类系统**：EXTJS采用面向对象的方式组织代码，其类系统是基于Ext.Base构建的。了解类系统有助于理解EXTJS如何扩展JavaScript对象并实现复用。 3. **组件库**：EXTJS 3.3包含了大量的预定义组件，如Grid面板、...
- **JS类系统**：ExtJS使用面向对象的类系统，类与类之间可以通过继承实现代码重用和扩展。 - **事件系统**：事件驱动是ExtJS的核心机制，允许组件间通信和响应用户操作。 - **Ajax通信**：Ext.Ajax模块负责异步...
NULL 博文链接：https://guoyiqi.iteye.com/blog/324849
面向对象编程（OOP）是ExtJS框架的核心设计理念之一。通过采用面向对象的方法，开发者可以更好地组织代码结构，提高代码的复用性和维护性。 - **类与继承**: 在ExtJS中，可以通过定义类来创建组件，并通过继承机制...