Spec-Zone.ru › Marionette.js 2

Marionette.Модуль

Предупреждение: устарело

Marionette.Модуль устарел и планируется к удалению в следующем основном выпуске библиотеки. Вместо Marionette.Модуля следует использовать AMD/CommonJS/ES6 для модульности. Плагин совместимости Marionette.Модуль доступен при необходимости после его удаления.

Модули Marionette позволяют создавать модульную инкапсулированную логику. Они могут использоваться для разделения больших приложений на несколько файлов и для создания отдельных компонентов вашего приложения.

Индекс документации

  • Основные принципы использования
  • Определения модулей
    • Определение функции обратного вызова
    • Определение объекта-литерала
  • Классы модулей
  • Определение подмодулей
  • Запуск и остановка модулей
  • Запуск модулей
    • События запуска
    • Предотвращение автоматического запуска модулей
    • Запуск подмодулей с родительским модулем
  • Остановка модулей
    • События остановки
  • Инициализаторы модулей (устарело)
  • Заключительные действия модулей (устарело)

Основные принципы использования

Модуль определяется непосредственно из объекта приложения. Для создания модуля достаточно указать его имя.

var MyApp = new Marionette.Application();

// Creates a new module named "MyModule"
var myModule = MyApp.module("MyModule");

myModule === MyApp.MyModule; // => true

Модули не могут быть перезаписаны после их создания. Последующие вызовы module с тем же аргументом имени не создадут новый модуль, а вместо этого вернут уже созданный экземпляр.

var MyApp = new Marionette.Application();

// Instantiates a new Marionette.Module
var myModule = MyApp.module("MyModule");

// Returns the module you just created
var theSameModule = MyApp.module("MyModule");

Определения модулей

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

Определение функции обратного вызова

Определение функции обратного вызова будет вызываться сразу же после вызова метода module.

Она будет получать 6 параметров в указанном порядке:

  • Сам модуль
  • Объект приложения
  • Backbone
  • Marionette
  • jQuery
  • Underscore
  • Любые пользовательские аргументы

Внутри функции обратного вызова вы можете добавить как частные, так и общедоступные функции и данные непосредственно в свой модуль.

MyApp.module("MyModule", function(MyModule, MyApp, Backbone, Marionette, $, _){

  // The context of the function is also the module itself
  this === MyModule; // => true

  // Private Data And Functions
  // --------------------------

  var myData = "this is private data";

  var myFunction = function(){
    console.log(myData);
  }


  // Public Data And Functions
  // -------------------------

  MyModule.someData = "public data";

  MyModule.someFunction = function(){
    console.log(MyModule.someData);
  }
});

console.log(MyApp.MyModule.someData); //=> public data
MyApp.MyModule.someFunction(); //=> public data

Дополнительные аргументы

Вы можете передавать дополнительные аргументы в функцию определения, позволяя импортировать сторонние библиотеки и другие ресурсы, которые вы хотите иметь в локальной области видимости вашего модуля.

Передайте дополнительные аргументы после определения в вызове module. 

MyApp.module("MyModule", function(MyModule, MyApp, Backbone, Marionette, $, _, Lib1, Lib2, LibEtc){

  // Lib1 === LibraryNumber1;
  // Lib2 === LibraryNumber2;
  // LibEtc === LibraryNumberEtc;

}, LibraryNumber1, LibraryNumber2, LibraryNumberEtc);

Разделение определения модуля

Иногда определение модуля может стать довольно длинным. Вы можете разделить его, выполняя последующие вызовы функции module.

Это может быть использовано для разделения определения модуля по нескольким файлам.

MyApp.module("MyModule", function(MyModule){
  MyModule.definition1 = true;
});

// The following could be in a separate file
MyApp.module("MyModule", function(MyModule){
  MyModule.definition2 = true;
});

MyApp.MyModule.definition1; //=> true
MyApp.MyModule.definition2; //=> true

Определение объекта-литерала

Определение модуля в виде объекта-литерала обеспечивает большую гибкость по сравнению с методом обратного вызова. Оно позволяет, например, указать пользовательский класс для вашего модуля.

Через определение объекта-литерала вы по-прежнему можете установить функцию определения через свойство define. 

MyApp.module("MyModule", {
  define: function(MyModule, MyApp, Backbone, Marionette, $, _) {
    // Define your module here
  }
});

Указание пользовательского класса модуля

Одна из наиболее полезных функций определения объекта-литерала — указание пользовательского класса модуля. Вы можете создать новый класс, используя функцию расширения.

var CustomModule = Marionette.Module.extend({
  // Custom module properties
});

MyApp.module("Foo", {
  moduleClass: CustomModule,
  define: function() {} // You can still use the definition function on custom modules
});

Если moduleClass опущено, Marionette по умолчанию инициализирует новый Marionette.Module.

Функция инициализации

Модули имеют функцию initialize, которая вызывается сразу после вызова модуля. Вы можете рассматривать функцию initialize как расширение конструктора.

Функция инициализации доступна только через определение модуля в виде объекта-литерала.

MyApp.module("Foo", {
  startWithParent: false,
  initialize: function(moduleName, app, options) {
    this.someProperty = 'someValue';
  },
  // You can still set a define function
  define: function(Foo) {
    console.log(this.someProperty); // Logs 'someValue'
  }
});

Функция initialize получает те же аргументы, что и конструктор.

  • Имя модуля
  • Приложение
  • Определение модуля в виде объекта-литерала (что позволяет передавать произвольные значения вашему модулю)
MyApp.module("Foo", {
  initialize: function( moduleName, app, options ) {
    console.log( options.someVar ); // Logs 'someString'
  },
  someVar: 'someString'
});

Функция инициализации отличается от функции define. Основное различие заключается в том, что initialize находится в цепочке прототипов, в то время как define нет. Это означает, что initialize может быть унаследован.

var CustomModule = Marionette.Module.extend({
  define: function() {},    // This is not inherited and will never be called
  initialize: function() {} // This, on the other hand, will be inherited
});

Классы модулей

Классы модулей могут использоваться как альтернатива шаблону определения.

Функция расширения модуля аналогична функциям расширения других классов Backbone и Marionette. Это позволяет вызывать события жизненного цикла модуля, такие как onStart и onStop непосредственно.

var FooModule = Marionette.Module.extend({
  startWithParent: false,

  initialize: function(moduleName, app, options) {
  },

  onStart: function(options) {
  },

  onStop: function(options) {
  },
});

MyApp.module("Foo", FooModule);

Если вся функциональность модуля определена внутри его класса, то класс можно передать напрямую. MyApp.module("Foo", FooModule)

Определение подмодулей

Подмодули (или «дочерние» модули) могут быть определены в одном вызове путем передачи списка модулей, разделенных точкой.

MyApp.module("Parent.Child.GrandChild");

MyApp.Parent; // => a valid module object
MyApp.Parent.Child; // => a valid module object
MyApp.Parent.Child.GrandChild; // => a valid module object

При определении подмодулей с использованием обозначения с точкой родительские модули не обязательно должны существовать; они будут созданы для вас. Если родительский модуль уже инициализирован, будет использован его экземпляр.

Доступ к модулям

Хотя модули прикрепляются непосредственно к экземпляру приложения, мы не рекомендуем обращаться к ним таким образом. Вместо этого используйте функцию .module() для доступа к вашим модулям.

Рассмотрим два примера доступа к модулю с именем MyModule.Submodule.

// Not recommended
var myModule = App.MyModule.Submodule;

// Recommended
var MyModule = App.module('MyModule.Submodule');

Запуск и остановка модулей

Модули могут запускаться и останавливаться независимо от приложения и друг от друга. Это позволяет загружать их асинхронно и останавливать их, когда они больше не нужны.

Это также облегчает тестирование модулей, так как вы можете запускать только тот модуль, который вам нужен в тестах.

Запуск модулей

Модули по умолчанию запускаются вместе с родительским приложением. Они также имеют функцию .start, которая может использоваться для запуска остановленного модуля или модуля, который настроен на запуск независимо от родительского модуля.

В этом примере модуль будет демонстрировать стандартное поведение и запускаться автоматически при вызове start объекта родительского приложения:

MyApp = new Marionette.Application();

MyApp.module("Foo", function(){
  // module code goes here
});

MyApp.start();

Обратите внимание, что модули, загруженные после вызова MyApp.start(), будут немедленно запущены.

События запуска

При запуске модуля будет вызываться событие "before:start" перед выполнением любых инициализаторов. Затем будет вызываться событие "start" после их выполнения.

var mod = MyApp.module("MyMod");

mod.on("before:start", function(){
  // do stuff before the module is started
});

mod.on("start", function(){
  // do stuff after the module has been started
});

Передача данных событиям запуска

.start принимает один параметр options, который будет передан событиям запуска и их эквивалентным методам (onStart и onBeforeStart).

var mod = MyApp.module("MyMod");

mod.on("before:start", function(options){
  // do stuff before the module is started
});

mod.on("start", function(options){
  // do stuff after the module has been started
});

var options = {
 // any data
};
mod.start(options);

Предотвращение автоматического запуска модулей

По умолчанию модули запускаются вместе с приложением. Если вы хотите запустить модуль вручную, вы можете изменить это поведение с помощью свойства startWithParent.

var fooModule = MyApp.module("Foo", function(){

  // prevent starting with parent
  this.startWithParent = false;

  // ... module code goes here
});

// start the app without starting the module
MyApp.start();

// later, start the module
fooModule.start();

То же самое можно сделать с определением объекта-литерала:

var fooModule = MyApp.module("Foo", {
  startWithParent: false
});

При разделении модуля на несколько файлов рекомендуется установить startWithParent в значение false.

Запуск подмодулей с родительским модулем

Как можно ожидать, подмодули по умолчанию запускаются вместе со своим родительским модулем. Запуск подмодулей выполняется в итерации обхода дерева сверху вниз. То есть, иерархия модулей, например, Foo.Bar.Baz запустит Baz сначала, затем Bar, а затем Foo.

MyApp.module("Foo", function(){...});
MyApp.module("Foo.Bar", function(){...});

MyApp.start();

В этом примере модуль "Foo.Bar" будет запущен при вызове MyApp.start() , потому что родительский модуль "Foo" (по умолчанию) настроен на запуск с приложением.

Подмодуль может переопределить это поведение, установив своё свойство startWithParent в значение false. Это предотвращает его запуск при вызове start родительского модуля.

MyApp.module("Foo", function(){...});

MyApp.module("Foo.Bar", function(){
  this.startWithParent = false;
})

MyApp.start();

Теперь модуль "Foo" будет запущен, но подмодуль "Foo.Bar" не будет запущен.

Подмодуль все еще может быть запущен вручную с этим конфигурацией:

MyApp.module("Foo.Bar").start();

Остановка модулей

Модуль может быть остановлен, или выключен, для освобождения памяти и ресурсов, когда он больше не нужен. Как и запуск модулей, остановка выполняется в итерации обхода дерева сверху вниз. То есть, иерархия модулей, например, Foo.Bar.Baz остановит Baz сначала, затем Bar, а затем Foo.

Для остановки модуля и его дочерних элементов вызовите метод stop модуля.

MyApp.module("Foo").stop();

Модули не останавливаются автоматически приложением. Если вы хотите остановить модуль, вы должны вызвать метод stop на нём или остановить родительский модуль. При остановке любого родительского модуля все его дочерние модули также будут остановлены.

MyApp.module("Foo.Bar.Baz");

MyApp.module("Foo").stop();

Этот вызов stop приводит к остановке модулей Bar и Baz, так как они являются подмодулями Foo . Более подробную информацию об определении подмодулей см. в разделе «Определение подмодулей».

События остановки

При остановке модуля будет вызываться событие "before:stop" перед выполнением любых заключительных действий. Затем будет вызываться событие "stop" после их выполнения.

var mod = MyApp.module("MyMod");

mod.on("before:stop", function(){
  // do stuff before the module is stopped
});

mod.on("stop", function(){
  // do stuff after the module has been stopped
});

Инициализаторы модулей

Предупреждение: устарело

Эта функция устарела и будет удалена в версии 3 Marionette. Вместо инициализаторов следует использовать события для управления логикой запуска. Событие start идеально подходит в качестве замены для инициализаторов.

Если вы полагались на отложенную обработку инициализаторов в своем приложении, используйте вместо этого Promises. Это может выглядеть примерно так:

doAsyncThings().then(myModule.start);

Модули, как и объекты Application, могут быть настроены на наличие инициализаторов. И, как и инициализаторы приложения, инициализаторы модулей выполняются всякий раз, когда модуль запускается. Кроме того, нет ограничений на количество инициализаторов.

Инициализаторы могут быть добавлены в функцию определения модуля.

MyApp.module("Foo", function(Foo){

  Foo.addInitializer(function(){
    // Do things once the module has started
  });

  Foo.addInitializer(function(){
    // You can have more than one initializer
  });

});

Заключительные действия модулей

Предупреждение: устаревший

Эта функция устарела и планируется к удалению в версии 3 Marionette. Вместо Finalizers следует использовать события для управления логикой запуска. Событие stop является идеальной заменой Finalizers.

Если вы полагались на отложенный характер Initializers в своем приложении, используйте вместо этого Promises. Это может выглядеть примерно так:

doAsyncThings().then(myModule.stop);

Модули также имеют финализаторы, которые работают в противоположном порядке инициализаторам: они вызываются всякий раз, когда модуль останавливается с помощью метода stop. Вы можете иметь любое количество финализаторов.

MyApp.module("Foo", function(Foo){

  Foo.addFinalizer(function(){
    // Tear down, shut down and clean up the module in here
  });

  Foo.addFinalizer(function(){
    // Do more things
  });

});

© 2016 Muted Solutions, LLC
Licensed under the MIT License.
https://marionettejs.com/docs/v2.4.7/marionette.module.html

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API