2010-07-21 1 views
3

У меня есть одна страница с двумя типами форм. У меня есть одна форма типа A сверху, а затем у меня есть 1 или более форм типа B ниже.Может ли шаблон шаблона Javascript использоваться для одиночных игр, а также для объектов, которые создаются через несколько раз?

Я использую шаблон модуля + Jquery телеграфировать все события на мои формы, ручки проверки, Ajax звонки и т.д.

Это предпочтительный/допустимый способ для определения синглтон, как в форме А, и класс объектов многократного использования, как в форме B? Они очень похожи, и я не уверен, что мне нужно использовать объект prototype, new или другой шаблон. Кажется, все работает для меня, но я боюсь, что я пропустил какую-то ключевую ошибку.

Form A Javascript выглядит следующим образом:

var MyProject.FormA = (function() { 
    var $_userEntry; 
    var $_domElementId; 

    var validate = function() { 
    if($_userEntry == 0) { 
     alert('Cannot enter 0!'); 
    } 
    } 
    var processUserInput = function() { 
    $_userEntry = jQuery('inputfield', $_domElementId).val(); 
    validate(); 
    } 
    return { 
    initialize: function(domElementId) { 
     $_domElementId = domElementId; 
     jQuery($_domElementId).click(function() { 
     processUserInput(); 
     } 
    } 
    } 

})(); 
jQuery(document).ready(function() { 
    MyProject.FormA.initialize('#form-a'); 
}); 

Form B, который инициализируется один или несколько раз, определяется следующим образом:

var MyProject.FormB = function() { 
    var $_userEntry; 
    var $_domElement; 

    var validate = function() { 
    if($_userEntry == 0) { 
     alert('Cannot enter 0!'); 
    } 
    } 
    var processUserInput = function() { 
    $_userEntry = jQuery('inputfield', $_domElement).val(); 
    validate(); 
    } 
    return { 
    initialize: function(domElement) { 
     $_domElement = domElement; 
     jQuery($_domElement).click(function() { 
     processUserInput(); 
     } 
    } 
    } 

}; 
jQuery(document).ready(function() { 
    jQuery(".form-b").each(function() { 
    MyProject.FormB().initialize(this); 
    }); 
}); 

ответ

2

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

Наследование прототипов на самом деле не совместимо с методом, скрывающим ваше достижение с помощью этого шаблона. Конечно, вы можете переписать это с помощью объекта прототипа формы с вашим определенным методом проверки, но тогда этот метод будет виден, и вы потеряете инкапсуляцию.

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

В этом случае я бы предположил, что разница в производительности незначительна, поэтому выбирайте то, что вам нравится. Лично я бы сказал, что между ними слишком много дублирования, и я был бы склонен объединить их. Вам действительно нужен A, чтобы быть синглом? Какова опасность того, что он случайно был создан дважды? Похоже, это может быть чрезмерная разработка для этой проблемы. Если у вас действительно есть синглтон, я бы обернул класс non-singleton (B) следующим образом:

var getSingleton = function() { 
    var form = MyProject.FormB(); 
    form.initialize("#form-a"); 
    console.log("This is the original function"); 
    getSingleton = function() {  
     console.log("this is the replacement function"); 
     return form; 
    } 
    return form; 
} 
1

Я думаю, вам просто нужно написать своего рода JQ плагин:

(function($) { 
    $.fn.formValidator = function() { 
     return $(this).each(function() { 
      var $_domElement = $(this); 
      $_domElement.click(function() { 
       if($('inputfield', $_domElement).val() == 0) { 
        alert('Cannot enter 0!'); 
       } 
      }); 
     }); 
    }; 
})(jQuery); 

В этом случае вы будете exte nd jQ элементов и сможет использовать его для любого количества элементов на странице (для сбора одиночных или нескольких элементов). Также он будет цепным.

Использование:

$('#form-a').formValidator(); 
$('.form-b').formValidator(); 

Или

$('#form-a, .form-b').formValidator(); 

Ofcourse вы можете использовать модуль для хранения этой функции:

ProjectModule.formValidator = function(selector) { 
    return $(selector).each(function() { 
     var $_domElement = $(this); 
     $_domElement.click(function() { 
      if ($('inputfield', $_domElement).val() == 0) { 
       alert('Cannot enter 0!'); 
      } 
     }); 
    }); 
}; 

Использование:

ProjectModule.formValidator('#form-a, .form-b'); 
Смежные вопросы