Inheritance
vertical way of using method of other class
base class
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
Ext.define('Person', { name : 'Unknown', constructor : function(name){ if(name){ this.name = name; } }, getName : function(){ alert("My name is " + this.name); } }); |
children class
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
Ext.define('Student', { extend : 'Person', schoolName : 'Unknown', constructor : function(name, schoolName){ this.schoolName = schoolName || 'Unknown'; //call parent class constructor this.callParent(arguments); }, getSchoolName : function(){ alert("My school name is " + this.schoolName); } }); var newStudent = new Student('XYZ', 'ABC School'); newStudent.getName(); //output: XYZ newStudent.getSchoolName(); //output: ABC School |
Mixins
horizontal way to use methods of another class (not parent)
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 |
Ext.define('Person', { name: 'Unknown', constructor: function(name) { if (name) { this.name = name; } }, getName: function() { alert("My name is " + this.name); }, eat: function(foodType) { alert("I'm eating " + foodType); } }); Ext.define('Student', { schoolName: '', constructor: function(schoolName) { this.schoolName = schoolName || 'Unknown' }, mixins: { eat: 'Person' }, getSchoolName: function() { alert("I am a student of " + this.schoolName); } }); var studentObj = new Ext.create('Student', 'XYZ'); studentObj.eat('Sandwich'); |