Extjs: расширение класса через конструктор или initComponent?

В extjs вы всегда можете расширить класс extjs через constructor(). Для классов, начинающихся с Component, вы также можете продолжить через initComponent().

Мне интересно, почему так много кода распространяется через initComponent, тогда как constructor представляется универсальным методом расширения. Предоставляет ли initComponent явное преимущество перед constructor?

Ответ 1

Во-первых, возможность переопределения через constructor была добавлена в более позднюю версию Ext, чем initComponent, поэтому весь код определенного возраста должен был бы использовать initComponent. В наши дни вы по-прежнему будете переопределять initComponent, если вы хотите сделать что-либо после, вызывается базовый класс initComponent (конструктор будет слишком рано для этого), но до, компонент оказаны. Во многих случаях (например, наиболее распространенных настройках конфигураций) это практически не имеет значения, и большинство людей делают все, что наиболее удобно. Однако есть некоторые случаи, когда это имеет значение.

Ответ 2

Позвольте мне попробовать обновленный ответ в терминах ExtJS версий 4.0-4.2 и выше.

constructor() - это метод object/class перед тем, как создавать. И initComponent() - это компонент перед показом.

constructor: function(config) {
  // ctor #1 - insert code here to modify config or run code to inject config
  // probably the cheapest place to make changes - before anything has been built

  this.callParent(arguments);

  // ctor #2 - insert code here if you need to make changes 
  // after everything has been rendered and shown, IIUC
},
initComponent: function() {
  // this function runs between ctor #1 and ctor #2

  // initComponent #1 - the UI component object tree is created,
  // (this object and child objects from config { items: [{...}]})
  // but they have not yet been rendered to DOM or shown.

  this.callParent(arguments);

  // initComponent #2 - I believe this is equivalent to ctor #2, 
  // I would prefer ctor as it is more universal.
}

Панели с детьми или сложная компоновка, вероятно, вам потребуется использовать initComponent, потому что вам нужно будет проверить и обработать компоненты (графический объект пользовательского интерфейса).

Но для отдельных элементов формы (combobox, button и т.д.) я придерживаюсь конструктора, который, я считаю, легче (до того, как все сложные конструкции объекта или изменения DOM) и является более универсальным. Конструкторы IOW могут использоваться для простых пользовательских интерфейсов, моделей и хранилищ данных; последние два не могут использовать initComponent.

Поэтому я использую initComponent, когда есть причина для этого. Часто, когда я пишу функцию initComponent, я пытаюсь манипулировать дочерними объектами пользовательского интерфейса, а мой следующий шаг - извлечь этот дочерний элемент управления в свой собственный Ext.define(), переместить пользовательский код для запуска в дочернем контрольном классе, который удаляет комплекс init из родительской панели. Этот процесс я повторил 4 раза на своей последней странице.

Ответ 3

Вот некоторые релевантные цитаты из книги Jay Garcia ExtJS в действии:

"initComponent выполняется внутри конструктора классов Component, но только после нескольких важных задач настройки для компонента. Эти задачи включают кэширование и применение свойств объекта конфигурации к экземпляру класса"

И позже, и в свете конструктора, когда параметры конфигурации получаются к экземпляру:

", если сконфигурированные экземпляры подкласса будут когда-либо нуждаться в клонировании через cloneConfig...., тогда расширение через конструктор является лучшим выбором."

Кстати, несмотря на то, что книга Jay касается ExtJS 3, похоже, что cloneConfig по-прежнему актуальна в ExtJS4; см:

http://docs.sencha.com/ext-js/3-4/#!/api/Ext.Component-method-cloneConfig

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Component-method-cloneConfig