Глобальные переменные в Ember

Отказ от ответственности: все методы, показанные ниже, основаны на моем опыте работы с EmberJS за последние несколько месяцев, а также на обсуждениях с моими коллегами. Если что-то не так, пожалуйста, повысьте голос. Мы все находимся на этапе обучения (а документация ember.js отстой для maxxx, так что будьте добры ;)

В настоящее время на моем рабочем месте есть два разработчика, которые используют Ember.js. Мы пришли к выводу, что хранить глобальные переменные в глобальном ApplicationController гораздо лучше, чем хранить в пространстве имен приложения. Это связано с тем, что получение этого значения может быть очень запутанным, если оно хранится в пространстве имен приложения. И это также хорошо работает в закрытии и, следовательно, делает глобальное пространство имен чистым (и относительно свободным от взлома). Вы же не хотите, чтобы ваш пользователь делал App.set, чтобы возиться с переменной, верно?

Это основано на 1.0.0 до 4.

Учитывая, что у вас есть эта глобальная переменная currentUserId

1. Хранение в пространстве имен. демонстрация jsFiddle

   (function() {
   
       function r() {
           return Math.round(Math.random()*999);
       }
   
       var MyApp = Ember.Application.create({
           currentUserId: null,
           ready: function() {
               //demo purpose.
               this.set('currentUserId', r());
           },
           rootElement: '#demo'
       });
       MyApp.ApplicationView = Ember.View.extend({
           templateName: 'application-view',
   
           //Direct child view
           innerView: Ember.View.extend({
               templateName: 'inner-view',
               setValue: function() {
                   this.set('controller.namespace.currentUserId', r());
               }
           }),
   
           //Direct child view, but with a controller attached
           innerViewWithController: Ember.View.extend({
               controller: Ember.Controller.create(),
               templateName: 'inner-view-with-controller',
               setValue: function() {
                   this.set('parentView.controller.namespace.currentUserId', r());
               }
           }),
           getValue: function() {
               alert(this.get('controller.namespace.currentUserId'));
           },
           setValue: function() {
               this.set('controller.namespace.currentUserId', r());
           }
       });
   })();
   

2. против хранения в глобальном масштабе ApplicationController демонстрация jsFiddle

   (function() {
   
       function r() {
           return Math.round(Math.random()*999);
       }
   
       var MyApp = Ember.Application.create({
           ApplicationController: Ember.Controller.extend({
               currentUserId: null,
               init: function() {
                   //demo purpose
                   this.set('currentUserId', r());
               }
           }),
           rootElement: '#demo'
       });
       MyApp.ApplicationView = Ember.View.extend({
           templateName: 'application-view',
   
           //Direct child view
           innerView: Ember.View.extend({
               templateName: 'inner-view',
               setValue: function() {
                   this.set('controller.currentUserId', r());
               }
           }),
   
           //Direct child view, but with a controller attached
           innerViewWithController: Ember.View.extend({
               controller: Ember.Controller.create(),
               templateName: 'inner-view-with-controller',
               setValue: function() {
                   this.set('parentView.controller.currentUserId', r());
               }
           }),
           getValue: function() {
               alert(this.get('controller.currentUserId'));
           },
           setValue: function() {
               this.set('controller.currentUserId', r());
           }
       });
   })();
   

Обратите внимание, что:

1. Если вы решили сохранить в пространстве имен, вам нужно будет постоянно обращаться к нему через корневой контроллер, так что это фактически то же самое, что и сохранение в applicationController с дополнительным ключевым словом namespace.

2. Если вы решили сохранить его в корневом каталоге applicationController, для любых представлений, происходящих от applicationView, вы можете легко получить доступ к переменной в своих шаблонах с помощью {{variableName}} без каких-либо обходов точек. По умолчанию Ember.Js ищет переменные через контроллеры.

3. В худшем случае, если вашему внутреннему представлению нужен собственный контроллер, доступ к глобальной переменной через корневой контроллер (или пространство имен) немного более болезненный, поскольку контроллеры не связаны, вам нужно будет пройти вверх по своим представлениям, пока не увидите корень контроллер. В Ember.JS все представления по умолчанию будут иметь установленный контроллер, а по умолчанию — родительский контроллер. Это означает, что если вы никогда не укажете какой-либо контроллер, все представления-потомки фактически связаны с корневым контроллером. Чтобы решить эту проблему, вы можете сделать привязку переменных в контроллере, чтобы легко решить проблему обхода.

Я не предлагаю вам помещать такую ​​важную переменную в глобальный объект window, так как она будет легко изменена пользователем (и вызовет любые потенциальные проблемы). Помещение его в глобальное пространство имен в пространстве имен приложения ember уменьшает потенциальную проблему, но не в том случае, если вы сделаете его глобальным.

Мои 2 цента ;)