Стандарты и передовая практика jQuery

В настоящее время я отвечаю за использование jQuery в сообществе веб-разработчиков нашей компании. Часть этого включает в себя представление курса, но другая часть включает в себя распространение стандартов и передовой практики.

Если вы погуглите "передовой опыт jQuery", вы, вероятно, найдете следующее среди результатов поиска. http://www.smashingmagazine.com/2008/09/16/jquery-examples-and-best-practices/ http://www.artzstudio.com/2009/04/jquery-performance-rules/

Они были полезны, и я пролил на них много полезной информации. Однако то, что меня действительно интересовало бы, были бы любые советы, ловушки, мнения и т. Д. По передовой практике от опытных разработчиков jQuery и тех, кто, возможно, оказался в положении, аналогичном мне. Также приветствуются любые хорошие ссылки.

РЕДАКТИРОВАТЬ:

На моей странице добавлен раздел "Стандарты кодирования jQuery":

http://www.jameswiseman.com/blog/?p=48


javascript jquery code-standards
person James Wiseman    schedule 07.08.2009    source источник

Ответы (4)


arrow_upward
42
arrow_downward

Вы можете найти эту популярную тему прямо здесь, на StackOverflow.com

подводных камней jQuery, которых следует избегать

Очень интересные полезные советы один за другим.

Вот еще кое-что, что я нашел в своих закладках:

person adardesign    schedule 07.08.2009
comment
Интересные ссылки, спасибо. Я понимаю, что тема очень похожа, однако мне все еще интересны ответы с точки зрения тех, кто находится в таком же положении, что и я. Кроме того, заголовок не поддается полезной ссылке при поиске, тогда как со временем он может всплывать (и ссылаться на другую тему теперь, когда вы ее добавили!) - person James Wiseman; 07.08.2009
comment
кстати, я только что нашел интересную ссылку (экспериментальная площадка jQuery) commadot.com/jquery, если вы переходите по ссылке за ссылкой, вы можете многому научиться ... - person adardesign; 21.12.2009
comment
Еще одна ссылка lab.abhinayrathore.com/jquery-standards - person FDisk; 01.02.2016

arrow_upward
27
arrow_downward

Я лично начал делать что-то вроде приложений венгерской нотации для jQuery устанавливает, добавляя к этим переменным префикс $

var someInt = 1;
var $someQueryCollection = $( 'selector' );

Я считаю, что по мере роста моих фрагментов jQuery это становится бесценным не только для продвижения хранения наборов jQuery в качестве переменных, но и для того, чтобы помочь мне отслеживать, какие переменные на самом деле являются наборами jQuery.

person Peter Bailey    schedule 07.08.2009

arrow_upward
12
arrow_downward

Ненавязчивый JavaScript (разделение разметки и поведения)

Раньше было принято помещать обработчик кликов в разметку. Теперь рекомендуется не писать код JS внутри разметки, а включать его через события DOM.

Прогрессивное улучшение

Пользователь получает лучший опыт, если он использует браузер, соответствующий стандартам, и / или у него включен JavaScript. Веб-сайт / веб-приложение по-прежнему доступны, даже если у них более старый браузер или отключен JS.

Обнаружение функций, а не обнаружение браузера

Оставляя в стороне вышеупомянутые моменты, я бы действительно сосредоточился на передаче сообщения (нарушая предвзятые представления) о том, что JavaScript - это игрушечный язык. Я видел слишком много разработчиков, которые так думают, и с тех пор все идет под откос. Вам нужно объяснить им, что JavaScript - это очень мощный язык и почему им нужна библиотека JS (из-за несоответствий браузера), хотя сам JS очень мощный.

Удачи.

person SolutionYogi    schedule 07.08.2009
comment
Джейсон, извините, но не могли бы вы указать, где я написал, что jQuery работает иначе, чем JavaScript? На самом деле я даже не упомянул jQuery в своем ответе. - person SolutionYogi; 07.08.2009
comment
Вы действительно думаете, что JavaScript - это игрушечный язык или это опечатка? - person Lie Ryan; 31.03.2013

arrow_upward
2
arrow_downward

То, как работает jQuery, НЕ то же самое, что работает JavaScript, хотя это одно и то же. jQuery работает с селекторами CSS, такими как имена классов и идентификаторы элементов. Чтобы выбрать элемент в jQuery, вам нужно:

$("#yourID") or $(".yourClass") or $("div") or $("#yourID p") etc

И вы получите набор всех элементов на странице, которые соответствуют вашим критериям. Затем вы можете выполнять свои действия со ВСЕМИ этими элементами без какого-либо цикла. Это важно помнить:

$(".yourClass").click(function(){
    //do stuff
});

повлияет на все элементы, к которым прикреплено .yourClass. Один совет: если вы собираетесь получить доступ к $(this), вы должны сохранить его как локальную переменную:

$(".yourClass").click(function(){
    var $this = $(this);
});

так как это ускорит вашу работу.

person Jason    schedule 07.08.2009
comment
-1. Мне не нравится это утверждение: «То, как работает jQuery, НЕ то же самое, что работает JavaScript». jQuery - это JavaScript. Я бы назвал это так: «Существует разница между ванильным JS-кодом для манипуляций с DOM и jQuery JS-кодом для манипуляций с DOM». - person SolutionYogi; 07.08.2009
comment
.... кроме того, что это правда. Я уже упоминал, что это одно и то же, но jQuery абстрагирует много дерьма, которое вам необходимо делать с javascript. поэтому, хотя вы можете смешивать js с jQ, они НЕ работают одинаково, и многие разработчики JS пытаются писать код JQ так же, как они пишут код JS. - person Jason; 07.08.2009
comment
Я досконально понимаю, как работают jQuery и JavaScript. У меня есть возражения по поводу того, как сформулировано предложение, ИМХО, оно неправильно читается. - person SolutionYogi; 07.08.2009