Разбираемся в Проблеме Пары JavaScript jQuery

Когда вы только начинаете изучать веб-разработку, то замечаете, что со временем перед вами открывается всё больше возможностей для создания сайтов, в том числе интерактивных. Как только вы обретаете необходимые знания и навыки, то различные интерактивные элементы, оптимизация загрузок и другие аспекты интерактивности уже не кажутся вам чем-то необычным, а становятся обыденностью или даже необходимостью. Поэтому как бы вы не осваивали разработку – в учебном заведении, онлайн или с помощью самообучения – вы должны понимать, что лучшим вариантом для реализации интерактивных возможностей является JavaScript. Ведь всё же, это язык Интернета! Но, что если я подскажу вам другой вариант? В этом руководстве мы постараемся рассмотреть известную всем пару JavaScript jQuery, а также рассказать об их соперничестве.

Для начала мы поговорим о каждом из них в отдельности – для чего они используются, их преимущества и недостатки. Позднее, как только мы узнаем о них более подробно, мы приступим к сравнению этих двух инструментов с различных точек зрения – доступности кода, карьерных возможностей и много другого. Итак, давайте сразу же перейдём к теме нашего руководства!

Проблема Пары JavaScript jQuery

Когда вы ищете ответ на вопрос о реализации какой-либо функции с помощью JavaScript на различных форумах, то часто встречаете похожий на этот ответ ‘просто используй для этого jQuery’.

Последний Найденный Купон Coursera:

Но, что такое jQuery? Вы думали, что для этого необходим лишь JavaScript, но появилась альтернатива? Теперь вы хотите узнать больше про дилемму JavaScript jQuery...

Или, возможно, ваша ситуация совсем иная. Кто-то порекомендовал вам воспользоваться jQuery для вашего сайта, но вы недавно узнали, что JavaScript может сделать то же самое что и jQuery и даже больше.

Теперь вы спрашиваете, разве JS это необходимость для вас? Почему нельзя просто воспользоваться готовым кодом jQuery?

Давайте остановимся на этом моменте — будет ли для вас сюрпризом то, что JavaScript и jQuery на самом деле даже близко не являются двумя различными вариантами?

jQuery Это JavaScript

Некоторые представляют проблему выбора между JavaScript и jQuery как выбор между двумя различными технологиями, но на самом деле jQuery является лишь другим способом использования JavaScript. Да, JS это jQuery и наоборот

jQuery часто называют фреймворком или библиотекой, хотя и довольно самодостаточной. Итак, давайте более подробно разберёмся с самим JavaScript.

Compare Online Learning Platforms Side by Side With Others

Did you know?

Have you ever wondered which online learning platforms are the best for your career?

See & compare TOP3 online learning platforms side by side

JavaScript

JavaScript — это язык программирования браузера, или по крайней мере он был таковым до недавнего времени – теперь его возможности и применение разрослись далеко за пределы окна браузера. Например, он используется для написания кода серверной части проекта.

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

Тогда, что такое jQuery?

Что Такое jQuery?

Как уже упоминалось, jQuery является библиотекой JavaScript. Это означает, что библиотека jQuery представляет собой коллекцию JavaScript-кода, упакованного вместе, что позволяет получить к нему доступ без необходимости в ручном написании кода. Необходимо лишь добавить простую строчку кода, чтобы внедрить в код JavaScript какую-либо функцию, заранее подготовленную в jQuery.

Если вы знакомы с фреймворком Bootstrap, то хорошей аналогией для вас будет отношение между CSS и Bootstrap. Bootstrap является своего рода коллекцией CSS-команд, которые делают процесс стилизации страниц более быстрым и простым. jQuery для JavaScript, то же что и Bootstrap для CSS.

Различия JavaScript и jQuery в Коде

jQuery

Первый урок в ‘Интерактивном курсе по jQuery‘ от BitDegree очень наглядно показывает различие между кодом JavaScript jQuery.

Примером является HTML-кнопка, которая позволяет открывать и закрыть форму для входа.

Вот код JavaScript:

const login = document.getElementById("login");
const loginMenu = document.getElementById("loginMenu");
login.addEventListener("click", () => {
if(loginMenu.style.display === "none"){
loginMenu.style.display = "inline";
} else {
loginMenu.style.display = "none";
}
});

А вот так выглядит код jQuery:

$("#login").click(() => {
$("#loginMenu").toggle()
});

Что заняло 9 строк кода с JavaScript, для jQuery потребовало лишь 3.

jQuery Лучше?

Ответ кажется очевидным, да? Просто используйте jQuery.

Это могло быть так пару лет назад, но в 2018 и текущем году актуальность jQuery в веб-разработке снижается, и примеры, подобные приведенному выше коду, становятся очень редки.

Конечно, причины для изучения и использования jQuery ещё остаются, но если стоит выбор между JavaScript и jQuery, то быстрое развитие технологий JavaScript и некоторые его новые возможности полностью исключают потребность в jQuery.

Причины Различий

Если вы изучаете JavaScript, то ваши возможности в веб-разработке будут гораздо более обширными, нежели использование ограниченного количества кода jQuery. Возможно, добавление готового кода быстрее и эффективнее, но при этом могут возникнуть другие проблемы.

Поведение кода jQuery может быть именно таким, какое вы от него ожидали, но будет тяжело добиться полного соответствия без соответствующих знаний в JavaScript. И, конечно же, стоит понимать, что jQuery состоит из кода JavaScript, поэтому вам нужно будет овладеть JavaScript, чтобы максимально эффективно использовать команды jQuery.

Фактически, JS это jQuery, но с гораздо большими возможностями.

Настолько Ли Всё Просто?

Хорошо, тогда всё стало более понятно? Различие между парой JavaScript jQuery в том, что jQuery более простой и лёгкий, а JavaScript более мощный и гибкий. Значит надо изучать только JavaScript?

Что же, не совсем так. К сожалению, на этот вопрос нет простого ответа. Изучение и использование того или иного инструмента зависит от множества факторов, вроде карьерных возможностей или потребностей вашего собственного проекта.

Карьерные Возможности

Если вашей целью является стать фронтенд разработчиком, то выбор между JavaScript jQuery будет для вас очевидным: изучайте JavaScript. Возможно, объявление о приёме на работу будет требовать знания jQuery, но опытные специалисты по JavaScript всегда будут в приоритете, так как обладают более гибкими возможностями при работе с кодом.

Даже если компания постоянно использует в своих проектах jQuery, после изучения JavaScript освоить jQuery будет гораздо проще и быстрее, чем наоборот. Изучить JavaScript гораздо сложнее, даже если вы мастер в jQuery.

Если вашей целью является стать фриланс веб-дизайнером, то JavaScript вряд-ли будет для вас обязательным условием. Если вы создаёте сайты для клиентов на базе систем управления контентом, вроде WordPress, то большая часть необходимых потребностей в интерактивности будет удовлетворена использованием jQuery.

Кроме того, большая часть сайтов может быть создана без необходимости в пользовательском коде JavaScript. Поэтому пока вы понимаете какой функционал для сайта требует особого кода JavaScript, вы можете обойтись лишь знаниями HTML, CSS и jQuery.

Итак, мы ответили на несколько важных вопросов: что такое jQuery и почему JS это необходимость для разработчика. Кроме того, мы даже узнали о различиях и сценариях для выбора того или иного инструмента.

Поэтому, если вы приняли решение и хотите начать обучение, то можете выбрать один курсов представленных ниже. Но, если вы хотите увидеть более детальное сравнение – продолжите чтение.

jQueryJavaScript

Особый Функционал

Итак, давайте постараемся копнуть немного глубже и взглянем на конкретные ситуации для применения.

JavaScript делает всё, что может делать jQuery, но в каких конкретных случаях лучше использовать код jQuery?

Кросс-Браузерная Совместимость

Если вы упомяните Internet Explorer при разработчике, который уже очень давно занимается разработкой, то можете заметить насколько сильно измениться выражение его лица. Он вспомнит те темныё времена, когда большая часть людей использовала этот знаменитый браузер от Microsoft.

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

Или, вы могли просто использовать jQuery, который бы делал эту сложную работу за вас. Библиотека jQuery могла интерпретировать одну строчку кода в определённый код для каждого из браузеров. На тот момент для разработчиков использование jQuery было необходимостью.

Однако в наше время различия между браузерами стали гораздо менее заметными. И если вы обнаружите несоответствия, например, при использовании некоторых функций последнего обновления языка JavaScript ES6, вместо этого рекомендуется использовать полифил. Полифилы — это обычные библиотеки, которые необходимы для устранения различий между браузерами и имеющие возможность реализации с помощью одного URL, который ссылается на соответствующий CDN в теге сценария.

Современные полифилы могут определить браузер, который использует пользователь и предоставить подходящий для этого браузера код. Это экономит много времени, так как пользователю надо будет загрузить лишь одну версию кода, вместо целой библиотеки jQuery.

JavaScript и jQuery - Полифилл

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

Управление DOM

DOM или объектная модель документа является своего рода интерпретацией веб-страницы браузером, которую вы предоставляете. Если вы нажмёте правой кнопкой мыши в любой части страницы и выберите просмотр кода, то под панелью элементов вы увидите DOM. Он может выглядеть как обычный код index.html, но вам стоит понимать, что большая часть HTML-контента динамически рендериться с сервера с помощью серверного языка вроде PHP.

Элементы DOM также могут отображаться и обрабатываться с помощью JavaScript, что является еще одной областью, в которой jQuery однажды оказался чрезвычайно полезным.

С jQuery вы можете направлять ноды DOM, в основном элементы HTML, (вроде заголовков) в коде

$(“h2”)

Затем вы можете связать функцию с этим кодом и делать все, что захотите, например, прослушивать события или изменять DOM, чтобы менять что-то на вашем сайте, пока пользователь его использует.

С помощью JavaScript вы можете сделать то же самое, используя данный код:

document.querySelector("h2")

Это не такое большое различие, не так ли? В прошлом методы управления DOM с JavaScript между различными браузерами были не такими простыми. Помимо этого, использование ванильного JavaScript (имеется в виду JavaScript без каких-либо библиотек) считается более эффективным в плане производительности – это означает, что код выполняется быстрее и использует меньше ресурсов памяти.

Опять же, при сравнении JavaScript и jQuery именно JavaScript здесь кажется победителем. Тем не менее, популярность jQuery означает то, что вы обязательно встретите его в различных приложениях.

Новые библиотеки, вроде Bling.js, даже позволяют использовать синтаксис jQuery без необходимости загружать всю библиотеку jQuery целиком, что говорит о сильной приверженности некоторых разработчиков к jQuery.

Кроме того, многие разработчики используют jQuery в тех случаях, когда понимают, что сильной разницы в производительности между использованием ванильного JavaScript и библиотеки не будет.

Поэтому, даже если изучать управление DOM с помощью JavaScript более правильно, знания jQuery в этой сфере всё равно могут вам пригодиться, так как в каких-то моментах это позволит вам сэкономить время.

Эффекты и Анимация

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

Хотя на сегодняшний день разработчики имеют доступ к Web Animations API и переходам CSS. Эти две технологии ваш веб-браузер понимает без необходимости в загрузке каких-либо библиотек, что это гораздо быстрее чем загрузка анимаций из библиотеки jQuery.

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

Преимущества
  • Professional service
  • Flexible timetables
  • A variety of features to choose from
Основные Функции
  • Professional certificates
  • University-level courses
  • Online degree programs
Преимущества
  • Easy to use
  • Offers quality content
  • Very transparent with their pricing
Основные Функции
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable
Преимущества
  • Simplistic design (no unnecessary information)
  • Good quality of courses (even the free ones)
  • A few different features to choose from
Основные Функции
  • Nanodegree Program
  • Suitable for enterprises
  • Paid Certificates of completion

API

Другим отличным способом использования jQuery в прошлом была его возможность производить вызов API. Вызов API — это получение данных на ваш сайт из внешнего источника, например, для многих сайтов требуется пользовательская карта, поэтому для этого можно воспользоваться API для получения функции Google Карт от Google.

Метод jQuery для вызова API часто использовался в прошлом, но теперь есть более лучший способ под названием Fetch, который является нативным для браузера и не уступает в функционале jQuery.

Заключение

Иногда самые полезные технологии не являются лучшим вариантом для изучения. Разработка сложный процесс, и иногда изучение слишком сложного языка может полностью сломить вашу волю к обучению.

JavaScript является мощным инструментом, но на его освоение необходимы долгие недели и месяцы. Даже опытные разработчики JavaScript открывают для себя что-то новое почти каждый день.

В качестве новичка в мире программирования и веб-разработки, вы не сможете делать многое с вашими начальными навыками JavaScript. Но если вы уже знаете HTML и CSS, то jQuery может помочь вам перейти на новый уровень гораздо быстрее.

Многие веб-разработчики начинают свой путь именно с использования jQuery. Несмотря на то, что изучение основ JavaScript считается самой важной частью становления фронтенд разработчиком, важно также почувствовать результаты ваших усилий. Именно jQuery может помочь вам это сделать.

Как только вы увидите работу вашего проекта с jQuery, то у вас появится больше мотивации продолжить изучение чего-то более сложного.

Самым правильным вариантом будет начать с основ JavaScript. jQuery же может стать отличным дополнением для ваших знаний.

Оставьте ваше честное мнение

Оставьте ваше честное мнение и помогите тысячам людей выбрать лучшую платформу для онлайн обучения. Все отзывы, позитивные или негативные, будут приниматься, если они честны. Мы не публикуем предвзятые отзывы и спам. Поэтому, если вы хотите поделиться вашим опытом, мнением или дать совет - у вас есть всё необходимое!

FAQ

Как вы выбираете на какие образовательные платформы онлайн курсов сделать обзор?

Мы выбираем платформы для онлайн обучения по размеру их рынка, популярности и самое главное, запросов наших пользователей или общего интереса найти честные MOOC обзоры про определённые платформы для онлайн обучения.

Как много вы изучаете перед написанием обзора на платформы для онлайн обучения?

Наши эксперты по MOOC проводят исследования неделями - только после этого они могут сказать, что их оценки различных аспектов финальные и завершённые. Даже несмотря на то, что это занимает много времени, это единственный способ гарантировать, что все основные особенности платформы для онлайн обучения протестированы и проверены, а вердикт основан на реальных данных.

Какой аспект самый важный при выборе того, какая платформа для онлайн курсов лучшая?

Было бы не правильно уделять внимание только лишь одному аспекту из выборки: приоритеты зависят от определённого человека, его ценностей, пожеланий и целей. То, что важно для одного человека, может быть совершенно безразлично для другого. В любом случае, все пользователи согласятся, что хорошее качество обучающего материала является необходимостью, если это платформа для онлайн курсов.

Как этот сайт для обзоров платформ онлайн обучения отличается от других?

Каждая платформа для обзора MOOC уникальна и имеет свои цели и ценности. Наши обзоры онлайн обучения на 100% честные и написаны после проведения тщательного анализа. Это цель, которой недостаёт многим платформам по обзору сайтов онлайн обучения, поэтому мы считаем это нашей суперсилой!

Дни
Часы
Минуты
Секунды