Наследование
В Ext JS 4 поддерживается наследование. То есть мы можем на основе существующих классов создать новые. Допустим у нас есть класс Person:
Ext.define('Classes.Person', { config: { name: 'Eugene', surname : 'Popov' }, constructor: function(name, surname) { this.initConfig(); if(name){ this.setName(name); } if(surname){ this.setSurname(surname); } }, getinfo: function() { alert("Полное имя : " + this.name + " " + this.surname); }, });
Образуем от него класс Manager
, это делается с помощью параметра extend
:
Ext.define('Classes.Manager', { extend: 'Classes.Person', config: { department: 'sales' }, constructor: function(name, surname, department) { this.initConfig(); if(department){ this.setDepartment(department); } // передаем параметры в конcтруктор родительского класса this.callParent([name, surname]); } });
Данный класс добавляет всего одно свойство - department
(отдел менеджера).
Здесь в секции extend: 'Classes.Person'
мы указываем, от какого класса наследуется текущий класс. А в конструкторе
передаем параметры в конструктор родительского класса с помощью метода callParent (этот метод вызывает такой же метод базового класса,
то есть в данном случае конструктор) : this.callParent([name, surname]);
.
В итоге новый класс будет содержать как свои свойства и методы, так и родительские:
var eugene = Ext.create('Classes.Manager'); eugene.getinfo(); alert("Department : " + eugene.getDepartment()); var tom = Ext.create('Classes.Manager', 'Tom', 'James', 'Software'); tom.getinfo(); alert("Department : " + tom.getDepartment());
Переопределение методов базового класса
В предыдущем примере, чтобы вывести сообщение о департаменте менеджера, нам приходилось использовать дополнительный метод. Однако мы можем
переопределить имеющийся метод getinfo
и выводить всю информацию в нем:
Ext.define('Classes.Manager', { extend: 'Classes.Person', config: { department: 'sales' }, constructor: function(name, surname, department) { this.initConfig(); if(department){ this.setDepartment(department); } // передаем параметры в конcтруктор родительского класса this.callParent([name, surname]); }, // переопределяем метод базового класса getinfo: function() { this.callParent(); alert("Департамент : " + this.department); } }); var eugene = Ext.create('Classes.Manager'); eugene.getinfo(); // Этот метод нам уже не нужен //alert("Department : " + eugene.getDepartment());
Вызов this.callParent();
вызывает метод getinfo базового класса.
Сущность наследования
Когда мы создаем обычные классы, как, например, выше класс Person
, и не используем при этом параметр extend
,
создаваемый класс все равно неявно наследуется от базового для всех класса Ext.Base
.
Использование секции extend
приводит к тому, что при создании класса на этапе предобработки (этап Extend) к создаваемому классу
присоединяется функционал класса-родителя. В итоге получается следующая цепочка наследования: