Иногда при разработке компонента его шаблон необходимо наделить js-функциональностью, событиями и прочим. Выглядеть это может примерно так:

if (typeof(BX.CrmQuickPanelEdit) === 'undefined')
{
   BX.CrmQuickPanelEdit = function(id)
   {
      this._id = id;
      this._settings = {};
      this._submitHandler = BX.delegate(this._clickHandler, this);
      BX.bind(BX(this._id + '_submit'), 'click', this._submitHandler);
   };
   BX.CrmQuickPanelEdit.prototype =
   {
      initialize: function(id, settings)
      {
         this._id = id;
         this._settings = settings;
      },
      getId: function()
      {
         return this._id;
      },
      _clickHandler: function(e)
      {
         console.log(e);
      }
   };
   BX.CrmQuickPanelEdit.create = function(id, settings)
   {
      var _self = new BX.CrmQuickPanelEdit(id);
      _self.initialize(id, settings);
      return _self;
   };
}

Аналогичные подходы вы можете видеть в JS-ядре Bitrix Framework (расположен в /bitrix/js/). Разобравшись в данном примере вы сможете легче понимать JS-код разработчиков Битрикс.

Пример вызова:

<script type="text/javascript">
   BX.ready(function(){
      BX.CrmQuickPanelEdit.create('some_id', null);
   });
</script>

Если нужен паттерн "одиночка", то реализовать это можно как часть create:

   BX.CrmQuickPanelEdit._self  = null;
   BX.CrmQuickPanelEdit.create = function(id, settings)
   {
      if (!this._self) {
         this._self = new BX.CrmQuickPanelEdit();
      }
      this._self.initialize(id, settings);
      return this._self;
   };

Что делает JS-класс: запоминает внутри себя некий ID (например, это может быть ID контейнера) и массив параметров, а также вешает обработчик на событие клика по кнопке подтверждения в форме указанного контейнера.