В этом топе я подниму вопрос, который наверное каждый задавал себе, а именно как лучше всего оформлять код на JS. Обращаю внимание здесь не рассматриваются примеры сложных страницы, например gmail, для таких вещей лучше использовать javascriptmvc или backbone, там свои правила работы. Здесь же я пытаюсь рассмотреть подавляющее большинство страниц, где JS имеет вспомогательную роль.
Как не странно все многообразие вариантов построения JS кода для таких страниц всего три:
1. Решение в лоб. JavaScript файл представляет собой совокупность функций. Из преимуществ сравнительное легкое чтение кода, при малом функционале. Но когда в файле число функций переваливает за 20, очень сложно определить «а что же на самом деле тут происходит?».
2. Второй вариант это попытка выделения классов. Почему попытка? Потому что опять же подавляющее, большинство задач, это набор функций. Например, мне очень тяжело представить класс который при нажатии на ссылку покажет всплывающее окно.(например simplemodal, nyromodal, jqueryui). Точнее класс, то выделить можно, но вот назвать полноценным, и оправданным очень проблематично.
3. Третий вариант писать плагины на фрэймворк, как например jqueryui на jquery. Из преимуществ, стильно, готово к повторному использованию. Единственный недостаток такого подхода, это трудоемкость работы. Так же после тога как плагины сделаны, нам приходится возвращаться к первому либо второму варианту.
Все же хочется писать качественно. Объединив сценарии из scrum, и именование методов из BDD, немного покурив, я родил следующий код. Очень интересно мнение хаброжителей, на сколько понятен код? Имеет ли смысл писать в таком стиле? Какие еще варианты написание качественного JS кода существуют(напомню, сайты с очень богатой JS функциональностью не рассматриваются, там иные подходы к разработке)?
Жду ваших комментариев.
Спасибо.
Ну и сам код
(function (window, document, undefined) { $(function () { i_want.show_pop_up_for_news_feeds_archive.when_you_click_to_link_archive(""); i_want.show_pop_up_for_news_video_archive.when_you_click_to_link_archive(""); i_want.show_pop_up_for_digest.when_you_click_to_link_archive(""); i_want.show_pop_up_for_suggestion_events.when_you_click_to_link_archive(""); i_want.hide_all_widgets.when_i_choose_news_feed_item(); }); var i_want = { show_pop_up_for_news_feeds_archive:{ when_you_click_to_link_archive: function(link_selector) { $(link_selector).live("click",function(){ alert("show popUp") }) and.load_content_for_current_popUp("",""); and.initialize_close_button_for_popUp(""); and.initialize_custom_scroll_for_news_content(""); and.initialize_custom_scroll_for_news_navigation(""); and.initialize_behavior_for_news_popUp(); var and = { load_content_for_current_popUp:function(url,selector_for_content) { alert("load_content_for_current_popUp"); }, initialize_close_button_for_popUp: function(button_selector){ alert("initialize close button"); }, initialize_custom_scroll_for_news_navigation:function(news_navigation_selector) { alert("initialize_custom_scroll_for_news_navigation"); }, initialize_custom_scroll_for_news_content: function(news_content_selector) { alert("initialize_custom_scroll_for_news_navigation"); }, initialize_data_picker: function(data_picker_selector) { alert("initialize_data_picker"); }, initialize_behavior_for_news_popUp:function(){ i_want.change_content.when_i_choose_item_in_navigation(""); i_want.change_navigation.when_i_change_date_on_data_picker(""); var i_want = { change_content:{ when_i_choose_item_in_navigation:function(navigation_item_selector){ alert("load new content"); and.initialize_custom_scroll_for_news_content(""); var and={ initialize_custom_scroll_for_news_content: function(news_content_selector) { alert("initialize_custom_scroll_for_news_navigation") } } } }, change_navigation:{ when_i_change_date_on_data_picker:function(data_picker_selector){ alert("change navigation"); and.load_new_navigation_from_ajax("","") var and={ load_new_navigation_from_ajax:function(url,selector_for_content) { alert("load content"); and.initialize_custom_scroll_for_news_navigation(""); and.load_new_news_content_from_ajax("url","") var and ={ initialize_custom_scroll_for_news_navigation:function(news_navigation_selector) { alert("initialize_custom_scroll_for_news_navigation"); }, load_new_news_content_from_ajax:function(url,selector_for_content) { var and={ initialize_custom_scroll_for_news_content: function(news_content_selector) { alert("initialize_custom_scroll_for_news_navigation"); } } } } } } } } } } } } }, show_pop_up_for_news_video_archive:{ when_you_click_to_link_archive:function(link_selector){ $(link_selector).live("click",function(){ alert("show popUp") }); and.load_content_for_current_popUp("",""); and.initialize_close_button_for_popUp(""); and.initialize_custom_scroll_for_news_navigation(""); and.initialize_behavior_for_news_popUp(); var and = { load_content_for_current_popUp:function(url,selector_for_content) { alert("load_content_for_current_popUp"); }, initialize_close_button_for_popUp: function(button_selector){ alert("initialize close button"); }, initialize_custom_scroll_for_news_navigation:function(news_navigation_selector) { alert("initialize_custom_scroll_for_news_navigation"); }, initialize_data_picker: function(data_picker_selector) { alert("initialize_data_picker"); }, initialize_behavior_for_news_popUp:function(){ i_want.change_content.when_i_choose_item_in_navigation(""); i_want.change_navigation.when_i_change_date_on_data_picker(""); var i_want = { change_content:{ when_i_choose_item_in_navigation:function(navigation_item_selector){ alert("load new content"); and.load_new_news_content_from_ajax("",""); var and={ load_new_news_content_from_ajax:function(url,selector_for_content) { alert("load new content"); and.initialize_video_player(""); var and={ initialize_video_player: function(video_player_selector) { alert("initialize_video_player") } } } } } }, change_navigation:{ when_i_change_date_on_data_picker:function(data_picker_selector){ alert("change navigation"); and.load_new_navigation_from_ajax("","") var and={ load_new_navigation_from_ajax:function(url,selector_for_content) { alert("load content"); and.initialize_custom_scroll_for_news_navigation(""); and.load_new_news_content_from_ajax("url") var and ={ initialize_custom_scroll_for_news_navigation:function(news_navigation_selector) { alert("initialize_custom_scroll_for_news_navigation"); }, load_new_news_content_from_ajax:function(url,selector_for_content) { alert("load new content"); and.initialize_video_player(""); var and={ initialize_video_player: function(video_player_selector) { alert("initialize_video_player") } } } } } } } } } } } } }, show_pop_up_for_digest:{ when_you_click_to_link_archive:function(link_selector){ $(link_selector).live("click",function(){ alert("show popUp") }); and.load_content_for_current_popUp(""); and.initialize_close_button_for_popUp(""); var and = { load_content_for_current_popUp:function(url) { alert("load_content_for_current_popUp"); }, initialize_close_button_for_popUp: function(button_selector){ alert("initialize close button"); } } } }, show_pop_up_for_suggestion_events:{ when_you_click_to_link_archive:function(link_selector){ $(link_selector).live("click",function(){ alert("show popUp") }); and.load_content_for_current_popUp(""); and.initialize_close_button_for_popUp(""); var and = { load_content_for_current_popUp:function(url) { alert("load_content_for_current_popUp"); }, initialize_close_button_for_popUp: function(button_selector){ alert("initialize close button"); } } } }, hide_all_widgets:{ when_i_choose_news_feed_item:function(){ alert("hide_all_widgets"); and.load_content_from_ajax("",""); and.initialize_close_button(""); and.initialize_custom_scroll_for_news_content(""); var and={ load_content_from_ajax:function(url,selector_for_content) { alert("load_content_from_ajax"); }, initialize_close_button: function(button_selector){ alert("initialize close button"); }, initialize_custom_scroll_for_news_content: function(news_content_selector) { alert("initialize_custom_scroll_for_news_navigation"); } } } } }; })(window, document); Автор: hubaxis
