Как я знаю, для Javascript пока нет конкретных шаблонов. Но я думаю, что есть потенциал для чего-то вроде подхода виджетов (компонентов). Поскольку в основном мы используем JavaScript для расширения возможностей нашего HTML-кода. Логично, что мы должны подключить каждый объект javascript к тегу html. Так что здесь у нас есть что-то вроде Model (jsObject) + View (HTMLrepresentation). Чтобы получить MVC, нам нужны контроллеры, и для этого у нас есть События. В этом случае у нас будет легко инкапсулированный компонент.
например:
// this is a part of some FormValid.js
<script>
function FormValid(){
}
FormValid.prototype.validate=function(){...}
</script>
//this is our HTML
<form id="form1"...onsubmit="this.jsObject.validate();">
</form>
<script>
//all the following stuff could be solved in one line, but you need to create some helper. Like Components.Attach("FormValid").to("form1");
var newObj=new FormValid()
var form=document.getElementById("form1");
from.jsObject=newObj;
newObj.htmlObj=form;
</script>
Также у меня есть идея использовать шаблонизаторы вроде Zparser для разделения вида и модели. Я занимаюсь разработкой библиотеки js для этого, поэтому я сейчас нахожусь в этом вопросе.
У нас есть основной объект с методом view . Все наши классы имеют его как прототип в конце. Этот метод получает свойство templates класса, а с помощью парсера некоторых шаблонов генерирует HTML на основе нашей модели. Этот HTML-код вставляется в узел htmlObj, поэтому вид нашего объекта обновляется. Это в основном идея, и наш код становится:
// this is a part of some FormValid.js
<script>
function FormValid(){
}
Components.extendCore(FormValid);
FormValid.prototype.validate=function(){...}
</script>
FormValid.prototype.templates={
main:'<form class="form1"...onsubmit="this.jsObject.validate();">...</form>'
}
//this is our HTML
<div id="form1"></div>
<script>
Components.Attach("FormValid").to("form1");
</script>
Я все еще думаю, что должен присутствовать последний встроенный <script>, и он не смешивает логику с представлением, потому что это компонент - сплошная часть. Это не имеет значения одно без другого. На самом деле это должно быть частью приложения. Что-то вроде html компонента (в одном примере это div) должно быть определено и обернуто компонентом, который автоматически добавит скрипт и идентификаторы.
Теперь. Я показал вам 2 примера, и я объясню, почему второй является слишком конкретным.
Все дело в доступности и производительности (и утечках памяти). Если вы будете часто обновлять все html-компоненты - он будет мигать, также вам нужно будет настроить все динамические события обратно и проверить все на утечки памяти. Но главная проблема, если JS выйдет из строя - ваше приложение ничего не покажет.
Поэтому я предпочитаю выбирать между этими двумя :) и использовать все на своих местах.