Кажется, что Js — это «просто скриптовый язык» на котором я по-быстрому добавлю нужные фичи на странице, не сильно заботясь о качестве кода. Когда-то это было верным. Даже текущие стандарты Js и Html в целом располагают к этой философии.
Но времена изменились! Теперь на Js создают сложные и запутанные веб-приложения, которые просто не могут не столкнуться с проблемами своих «старших братьев» (серверных приложениях написанных на Java, C# и т.д.). А значит, чтобы не погрязнуть в тысячах строк «спагетти-кода», требуется отказаться от философии «просто скрипт». Нужно воспринимать Js как инструмент, с которым требуется создать сложную, модульную и масштабируемую систему.
В рамках новой философии «серьезного языка, для серьезных задач» я хочу начать цикл небольших статей о мире Js со стороны Java разработчика. Начнем с инструментов и различных шаблонов разработки.
1. Хорошая IDE
Не трате время на копание в Js через блокнот. Для серьезного кода вам нужна серьезная IDE. Если вы сидите в IDEA, то js поддержка у вас уже из коробки, но что делать если вы используете Eclipse? Для этого случая неожиданно подходит NetBeans. Да, да, эта IDE обладает достойной поддержкой Js! Просто запускаете ее параллельно с Eclipse и добавляете в нее не java исходники, а папки с js, css и html (jsp).
2. Логгирование
Вы можете себе представить свой серверный код без логгирования? Ну тогда, как же можно представить без логов клиентский код? Используйте библиотеку для логгирования, которая поддерживает разные браузеры. Например, log4javascript.
3. Дебаг
Тут все понятно. Для FireFox ставим FireBug, в Опере и Хроме используем встроенные дебагеры.
4. Отказ от глобальных функций
Js очень располагает к одному глобальному контексту. Но мы то знаем, что в большом приложении нужна модульность, нужны простые изолированные контексты. Поэтому вспомните ООП: изолируйте логику в отдельные классы, а не размазывайте ее по десяткам глобальных функций, которые можно вызвать откуда угодно, и которые всегда можно случайно перекрыть создав функцию с тем же именем.
Пример изоляции логики в «классе»:
/**
* Это javadoc для описания класса
* @param {String} str - а это описание параметра конструктора
*/
NoteDocument = function(str){
//удобная ссылка на сам объект
var self = this;
//внутреннее поле
var data;
//публичный метод
this.init = function(){
parse(str);
};
//внутренний метод
function parse(str){
...
}
};
Как выглядит создание экземпляра:
var doc = new NoteDocument("hello!");
doc.init();
Напоминает код на Java, не правда ли? :)
5. Использование пакетов
В самом языке нет поддержки пакетов. Увы. Так что придется использовать какую-нибудь библиотеку.
Пример такой библиотеки:
function namespace(){};
/**
* create new namespace if it is not exist
* @param newNamespace string namespaces like "aaa.dddd.fff"
*/
namespace.prototype.useNamespace = function(newNamespace){
var namespaces = newNamespace.split(".");
if (!this[namespaces[0]]){
this[namespaces[0]] = new namespace();
}
if (namespaces.length > 1){
this[namespaces[0]].useNamespace(newNamespace.substring(namespaces[0].length+1));
}
};
Далее в приложении создаем корневой пакет…
var app = new namespace();
… и переводим на него наши классы:
app.useNamespace("model.note");
app.model.note.NoteDocument = function(str){
...
}
...
var doc = new app.model.note.NoteDocument("hello!");
doc.init();
6. Юнит-тестирование
Да, и это тоже можно сделать в Js! Ведь тесты — это замечательно! Воспользуйтесь, например, библиотекой QUnit.
Пример юнит-теста, который «почти как JUnit тест»:
app.useNamespace("model.note");
app.model.note.NoteDocumentTest = function(){
this.test_get_sections_and_blocks = function(){
var data = new TestNoteModel();
var doc = new app.model.note.NoteDocument(data.note);
//check
var sections = doc.getRootElems();
assertEquals(2, sections.length);
assertEquals(null, sections[0].children);
assertEquals(null, sections[1].children);
};
}
7. Статический анализ кода
В скриптовом языке надо быть аккуратным, т.к. вы легко можете пропустить синтаксическую ошибку. Добавьте в проект статический анализатор кода, который будет за вас делать грязную работу по поиску глупых опечаток при каждой сборке. Например, Jslint.
Итоги
В данной статье мы рассмотрели набор инструментов и шаблонов разработки в Js, которые служат для улучшения качества кода и поддержки сложных клиентских приложений. Приятной работы!
