Застрял в объектной пробельной области/ссылке

Вот пример моей структуры:

this.is.a.really.long.namespace = {
 inputs : {},
 buttons : {},
 panels : {},
 fn : {
 abc : function() {},
 def : function() {}
 } 
};

Теперь, как вы можете видеть, я храню свои входы, кнопки, панели и функции в своих соответствующих литералах объектов. Проблема заключается в fn.abc, fn.def или любой другой функции внутри page.fn. Я хочу иметь доступ к моим inputs, buttons и panels из функций внутри fn.

Очевидно, я знаю, что могу набрать this.is.a.really.long.namespace.inputs, но, как вы можете видеть, это довольно долго, и я не хочу вводить его для каждого отдельного экземпляра, где мне нужно ссылаться на объект внутри страницы.

Не могу ли я напрямую ссылаться на inputs, buttons и panels в пределах fn?

Я думал, что смогу сделать:

fn : {
 that : this.is.a.really.long.namespace,
 abc : function() {},
 def : function() {}
}

который позволил бы мне использовать that.inputs внутри fn.abc, но есть ли проблема с этим методом? Мне нужно знать какие-то накладные расходы? Или есть лучший способ сделать это?

4 ответа

Хорошо... Вот что я в итоге сделал:

this.is.a.really.long.namespace = {
 inputs : { firstName : undefined },
 buttons : { submit : undefined },
 fn : {
 root : undefined,
 abc : function() { console.log(this.root.inputs.firstName); },
 def : function() { console.log(this.root.buttons.submit); }
 },
 init : function() {
 var self = this,
 fn = self.fn,
 inputs = self.inputs,
 buttons = self.button;
 fn.root = this; // this is the key
 inputs.firstName = $("#first-name");
 buttons.submit = $("#submit-button");
 fn.abc();
 fn.def();
 }
};


В этом нет ничего плохого. Фактически, вы, вероятно, уменьшите накладные расходы по следующим причинам:

  • Меньшее время выполнения иерархических объектов объекта
  • Меньше символов = короче script

Более сложная конструкция - это обычно используемый шаблон модуля.

Javascript довольно неэффективен внутри (например, он не имеет реальных индексированных массивов), поэтому все, что вы можете сделать для сокращения времени выполнения, обычно хорошо. Создание указателя на длинную иерархию будет намного быстрее, чем использование полной иерархии каждый раз. Это, вероятно, будет иметь значение только в длинных циклах, но так как это также легче читать, это просто бонус быть немного быстрее - нет недостатка.

(редактировать)

чтобы сделать это с помощью прямых объектов, вы могли бы сделать что-то подобное, используя jQuery для упростить добавление свойств:

this.is.a.long.namespace = {};
$.extend(this.is.a.long.namespace, 
 { that: this.is.a.long.namespace,
 ... // other properties 
 });

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

this.is.a.long.namespace = (function() 
{
 var that = {},
 somePrivateVariable;
 function privateFunction() {
 ...
 } 
 that.inputs = {};
 ...
 // assign everything to "that"
 return that;
}());


Я бы подумал примерно так:

var namespace = this.is.a.really.long.namespace
this.is.a.really.long.namespace = {
 root : namespace,
 inputs : {},
 buttons : {},
 panels : {},
 fn : {
 abc : function() {},
 def : function() {}
 } 
};

оттуда у вас не должно быть проблем с ссылкой на ваше пространство имен в любом месте объекта.


Если вы создадите объект таким образом, чтобы каждый уровень содержал параметр parent, указывающий на уровень выше него, вы можете получить доступ к данным таким образом. Взгляните на этот похожий вопрос.

licensed under cc by-sa 3.0 with attribution.