ExtJS学习------Ext.define的继承extend,用javascript实现相似Ext的继承
2017-04-20 15:50
429 查看
(1)Ext.define的继承extend
详细实例:
实例结果:
(2)使用javascript实现类似Ext的继承
实例:
实例结果:
详细实例:
Ext.onReady(function(){ //Sup Class 父类 Ext.define('Person',{ config:{ name:'bjsxt' } , constructor:function(config){ var me = this ; me.initConfig(config); } }); //Sub Class 子类 Ext.define('Boy',{ //使用Ext的继承 extend:'Person',//直接继承 config:{ sex:'男', age:20 } }); var b = Ext.create('Boy',{ name:'张三', age:25 }); alert('姓名:'+b.name+'--性别:'+b.sex+'--年龄:'+b.age); });
实例结果:
(2)使用javascript实现类似Ext的继承
实例:
Ext.onReady(function(){ //javascript : prototype(原型) :实现继承 //SupClass var Person = function(name){ this.name = name; }; //alert(Person.prototype.constructor); //原型对象的构造器,默认是当前的类的模板 //SupClass prototype object Person.prototype = { constructor:Person , id:100 }; //SubClass var Boy = function(name,sex,age){ //借用构造函数继承的方式 Person.call(this,name); this.sex = sex ; this.age = age ; }; //实现原型继承: 继承了父类的模板和父类的原型对象 //Boy.prototype = new Person(); //自己实现extend的方法 function myextend(sub , sup){ var F = function() {}, //定义一个空函数做为中转函数 subclassProto, //子类的原型对象 //把父类的原型对象 交给了superclassProto变量 superclassProto = sup.prototype; // 做中转的位置:把父类的原型对象 赋值给了 F这个空函数的原型对象 //进行原型继承 F.prototype = superclassProto; subclassProto = sub.prototype = new F(); subclassProto.constructor = sub; //还原构造器 sub.superclass = superclassProto; //做了一个保存,保存了父类的原型对象 //目的是为了防止你大意了 if (superclassProto.constructor === Object.prototype.constructor) { superclassProto.constructor = sup; } }; myextend(Boy ,Person);//自己实现的继承方法 var b = new Boy('李四','男',25);// /* 注:传统的javascript方法实现继承 * Boy.prototype=new Person('李四'); * var b=new Boy('男',25); */ alert('姓名:'+b.name+'--性别:'+b.sex+'--id:'+b.id+'--年龄:'+b.age); });
实例结果:
相关文章推荐
- JavaScript和ExtJS的继承 Ext.extend Ext.applyIf
- 阅读Ext 学习Javascript(二)Core/Ext.extend 从继承说起
- 阅读Ext 学习Javascript(二)Core/Ext.extend 从继承说起
- 阅读Ext 学习Javascript(二)Core/Ext.extend 从继承说起
- JavaScript和ExtJS的继承 Ext.extend Ext.applyIf (转)
- 阅读Ext 学习Javascript(二)Core/Ext.extend 从继承说起
- 阅读Ext 学习Javascript(二)Core/Ext.extend 从继承说起
- ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展
- ExtJs中继承的实现与理解—extend
- ExtJs中继承的实现与理解—extend
- Javascript学习笔记:6种实现继承的方式
- JavaScript学习系列之深入原型链与继承的实现
- 学习javascript面向对象 javascript实现继承的方式
- extjs的Ext.extend的使用样例(Ext继承)
- JavaScript 域名学习及对象的继承实现
- 学习javascript面向对象 javascript实现继承的方式
- ExtJs中继承的实现与理解—extend
- javascript类学习(一)——构造器与原型链实现简单的继承
- ExtJs学习一 Ext.define 与 Ext.create 方法总结
- ExtJS学习-----------Ext.String,ExtJS对javascript中的String的扩展