2015-03-14 3 views
0

в течение некоторого времени, я структурировать свой JavaScript код, как это:Как избежать функции геттер/сеттер в шаблоне модуля при передаче аргументов

;(function() { 
    function Example(name, purpose) { 
     this.name = name; 
     this. purpose = purpose; 
    } 

    Example.prototype.getInfo = function() { 
     return 'The purpose of "' + this.name + '" is: ' + this.purpose; 
    } 

    Example.prototype.showInfo = function() { 
     alert(this.getInfo()); 
    } 

    var ex = new Example('someModule', 'Showing some stuff.'); 

    ex.showInfo(); 
})(undefined); 

Fiddle

Теперь я понял, что эта модель далека от идеальной, как это имеет некоторые проблемы:

  • Он не использует замыкания/сфера так имитируют общественные & частные пользователей ,
  • Он не экспортирует что-то, что означает, что сам модуль действительно не инкапсулирован. & namespaced.

(Отказ от ответственности:. Я не использовал его в любом большом проекте, так что я могу отсутствовать некоторые важные детали, которые возникают при работе в реальных условиях живых)

Чтобы решить эти проблемы, я начал искать в шаблоны проектирования JavaScript. Один из шаблонов, который сразу же мне понравился, - это шаблон модуля .
Я попытался переписать код, приведенный выше, используя шаблон модуля, но я не могу получить его совершенно правы:

var Example = (function() { 

    function getInfo() { 
     return 'The purpose of "' + name + '" is: '; 
    } 

    // Public stuff 
    return { 
     name: '', 
     purpose: '', 
     setInfo: function(name, purpose) { 
      this.name = name; 
      this.purpose = purpose; 
     }, 
     showInfo: function() { 
      alert(getInfo()); 
     } 
    }; 
})(undefined); 

Example.setInfo('someModule', 'Showing some stuff.'); 
Example.showInfo(); 

неработающего Пример: Fiddle

Теперь сам модуль инкапсулируются внутри Example пространства имен & есть что-то вроде публичных & частных членов, но работать с ним совсем не так, как мне кажется, &, возможно потому, что я не могу обернуть голову тем, что нет экземпляра, созданного с использованием ключевого слова new.

В нерабочем примере почему это предупреждение result хотя эта строка никогда не установлена ​​& Почему purpose не предупреждены? Я думаю, что сам метод setInfo работает, поэтому, вероятно, это проблема с областью, которую я не понимаю.

Кроме того, есть ли способ использовать функции геттера/сеттера? Для меня это в настоящее время выглядит как присвоения я обычно делаю в конструкторе не действительно возможно с помощью шаблона модуля:

function Example(name, purpose) { 
    this.name = name; 
    this. purpose = purpose; 
} 

Использования шаблона модуля, я либо должен пользователя геттер/сеттера или что-то вроде «универсальная функция setter» в форме функции init.

Исходя из PHP OOP, я всегда стараюсь избегать их как можно больше, но я не знаю, как справиться с этим на языке, основанном на прототипе.

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

ответ

0

Я не уверен, если это то, что вы пытаетесь достичь:

http://jsfiddle.net/Ly66mcxo/1/

Example = (function() { 
    var _name, _purpose; 

    function getInfo() { 
     return 'The purpose of "' + _name + '" is: ' + _purpose; 
    } 

    // Public stuff 
    return { 
     setInfo: function(name, purpose) { 
      _name = name; 
      _purpose = purpose; 
     }, 
     showInfo: function() { 
      alert(getInfo()); 
     } 
    }; 
})(undefined); 

Example.setInfo('someModule', 'Showing some stuff.'); 
Example.showInfo(); 
1

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

Здесь работает fiddle

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

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

Когда вы используете this, область действия this изменяет объект return {}, и они больше не ссылаются на объект Example.

Использование функции геттер/сеттер Они вам не нужны. присваивания, но помните, что переменные будут привязаны к себе, поэтому вам нужно будет сделать self.name = name и self.purpose = purpose, чтобы выполнять задания или получать значения.

var Example = (function() { 
    var self = this; 
    function getInfo() { 
     return 'The purpose of "' + name + '" is: ' + purpose; 
    } 

    // Public stuff 
    return { 
     name: '', 
     purpose: '', 
     setInfo: function(name, purpose) { 
      self.name = name; 
      self.purpose = purpose; 
     }, 
     showInfo: function() { 
      alert(getInfo()); 
     } 
    }; 
})(undefined); 

Example.setInfo('someModule', 'Showing some stuff.'); 
Example.showInfo(); 

Update: Fiddle не был сохранен должным образом я обновил это. Также там я только что исправил ваш код.

Я думаю this является то, что вы пытаетесь достичь:

var Example = (function (params) { 
    var self = this; 
    self.name = params.name; 
    self.purpose = params.purpose; 

    function getInfo() {  
     return 'The purpose of "' + self.name + '" is: ' + self.purpose; 
    }; 
    self.showInfo(alert(getInfo())); 

    return{ 

    }; 
}); 

var myExample = new Example({ 
    name: 'someModule', 
    purpose: 'somePurpose' 
}); 
myExample.showInfo(); 
+0

Спасибо за ваш ответ! Код, который вы опубликовали, работает, но где-то в скрипке есть ошибка. Во всяком случае: когда мне не нужны геттеры и сеттеры, то почему в вашем коде есть также метод setInfo? - это не сеттер? – Sven

+0

Моя скрипка не была связана правильно ... Я обновил это. Также это просто исправление кода. – Guanxi

0

Проверить сейчас

var Example = (function() { 

    var _this = this; 

    _this.getInfo = function() { 
     return 'The purpose of "' + _this.name + '" is: ' + _this.purpose; 
    } 

    return { 
     setInfo: function (name, purpose) { 
      _this.name = name; 
      _this.purpose = purpose; 
     }, 
     showInfo: function() { 
      alert(_this.getInfo()); 
     } 
    }; 

})(undefined); 

Example.setInfo('someModule', 'Showing some stuff.'); 
Example.showInfo();