ExtJS learning ------ Ext. define inheritance extend, using javascript to implement inheritance similar to Ext, extjsext. define
(1) Ext. define inheritance extend
Specific instance:
Ext. onReady (function () {// Sup Class parent Class Ext. define ('person', {config: {name: 'bjsxt '}, constructor: function (config) {var me = this; me. initConfig (config) ;}}); // Sub Class subclass Ext. define ('Boy ', {// use Ext to inherit extend: 'person', // directly inherit config: {sex: 'male', age: 20 }}); var B = Ext. create ('Boy ', {name: 'zhang san', age: 25}); alert ('name:' + B. name + '-- Gender:' + B. sex + '-- Age:' + B. age );});
Instance result:
(2) use javascript to implement inheritance similar to Ext
Instance:
Ext. onReady (function () {// javascript: prototype (prototype): Implement inheritance // SupClassvar Person = function (name) {this. name = name ;}; // alert (Person. prototype. constructor); // constructor of the prototype object. The default value is the template of the current class. // SupClass prototype objectPerson. prototype = {constructor: Person, id: 100}; // SubClassvar Boy = function (name, sex, age) {// borrow the method inherited by the constructor: Person. call (this, name); this. sex = sex; this. age = age ;}; // implement prototype inheritance: inherits the template of the parent class and the prototype object of the parent class. // Boy. prototype = new Person (); // function myextend (sub, sup) {var F = function (){}, // define an empty function as the transit function subclassProto, // prototype object of the subclass // hand over the prototype object of the parent class to the superclassProto variable superclassProto = sup. prototype; // The intermediate position: Assign the prototype object of the parent class to the prototype object of the empty function F. // inherit the prototype F. prototype = superclassProto; subclassProto = sub. prototype = new F (); subclassProto. constructor = sub; // restores the constructor sub. superclass = superclassProto; // saves the prototype object of the parent class. // The purpose is to prevent you from ignoring if (superclassProto. constructor = Object. prototype. constructor) {superclassProto. constructor = sup ;}}; myextend (Boy, Person); // self-implemented Inheritance Method var B = new Boy ('lily', 'mal', 25 ); /// * Note: Traditional javascript methods inherit * Boy. prototype = new Person ('Li si'); * var B = new Boy ('male', 25); */alert ('name: '+ B. name + '-- Gender:' + B. sex + '-- id:' + B. id + '-- Age:' + B. age );});
Instance result:
Extjs learning problems, really depressed recently want to learn extjs, download the ext-230 on the official website, always don't do well
First, the problem may be that the order of the ext package is wrong. We recommend that you write the package order according to the api documentation ,,,
I don't know much about others. I am also a beginner. If you are interested, you can communicate with me. In fact, for beginners, just look at the api and examples. ext4.0 charges fees, so if you don't need it very much, don't use 4.0 or less ,,
How does Extextend inherit objects on the page?
MyPanelUi is to continue from Ext. Panel, so you should use a new one, and the code is:
Var mypanel = new MyPanelUi ();
Mypanel. render ("hello ");