Веб-разработчик в какой-то момент всегда задает себе этот вопрос, что мне следует кодировать: jQuery или JavaScript? Несколько начинающих веб-разработчиков хотят знать точную разницу между ними.
JQuery и JavaScript на самом деле одно и то же. JQuery - это группа библиотек JavaScript, разработанная для операций DOM на странице HTML, таких как анимация, обработка событий, обход и взаимодействия Ajax.
Чтобы использовать любой из двух языков сценариев, необходимо твердо придерживаться JavaScript. Поэтому, если вы только начали, пожалуйста, получите базовые знания о JavaScript. Тогда вы обнаружите, что jQuery делает то же самое, что и JavaScript, но требует меньше строк кода, чем требует традиционный JavaScript.
Теперь мы можем провести сравнительное исследование обоих этих языков сценариев и предложить, какой из них использовать для вашего следующего проекта веб-разработки.
JavaScript
JavaScript - это язык сценариев, используемый для повышения динамичности веб-страниц и увеличения взаимодействия с пользователем.
JavaScript используется на большинстве веб-сайтов и приложений, наиболее популярными из которых являются Gmail и Facebook. Динамический характер веб-сайтов, который изменяет раздел страницы без перезагрузки всей страницы, достигается с помощью JavaScript. Еще один интересный пример того, что может делать JavaScript, - это определение того, открывает ли посетитель веб-сайта ссылку на компьютере или на мобильном устройстве. Затем мы можем отобразить мобильную версию сайта, если посетитель использует мобильный.
У JavaScript есть бесконечное количество случаев использования, когда он изменил способ взаимодействия людей с веб-сайтами. Кроме того, это не ограничивается только созданием веб-сайтов, JavaScript очень активно используется для разработки на стороне сервера (пример: node.js), настольных приложений, разработки динамических игр и т. Д.
Было время, несколько лет назад, когда JavaScript по-разному отображался в разных веб-браузерах, поэтому веб-разработчикам было сложно кодировать на JavaScript и заставить его работать одинаково во всех популярных браузерах. Сейчас это изменилось, поскольку новые стандарты W3C заставляют все веб-браузеры единообразно реализовывать JavaScript. Это облегчает жизнь разработчикам, поскольку не тратит время на отладку кода, пытаясь заставить его работать в конкретном браузере.
JQuery
JQuery - это быстрая, небольшая и многофункциональная библиотека JavaScript. Он сам решает все проблемы с кроссбраузерностью. jQuery также называют фреймворком JavaScript.
Выполнение обхода, манипулирования, анимации, обработки событий и Ajax HTML DOM (объектной модели документа) с помощью jQuery стало настолько простым. Кроме того, он обеспечивает единообразную работу одного и того же кода во всех веб-браузерах. Пишите меньше, делайте больше - это девиз jQuery.
JQuery очень прост в понимании и даже проще в использовании, поэтому его кривая обучения очень мала. Код JavaScript здесь - это пара других библиотек на основе JavaScript, например, MooTools, но jQuery является наиболее популярным, потому что он настолько прост в использовании и чрезвычайно эффективен.
На самом деле JavaScript и jQuery не двух разных языков программирования. Вместо этого внизу у них тот же код JavaScript. Настоящая разница заключается в том, как разработчик использует их при кодировании. JQuery был написан и импровизирован для выполнения наиболее распространенных скриптовых функций с использованием очень небольшого количества строк кода. Следовательно, то, что требует 10 строк для задачи с использованием JavaScript, может быть выполнено в 2 строки с помощью jQuery, просто вызвав соответствующую функцию jQuery.
Давайте посмотрим на базовый пример "события щелчка мыши":
Предположим, у нас есть элемент ввода для кнопки, и мы хотим прослушать событие щелчка мыши на этой кнопке и получить уведомление в виде сообщения окна предупреждения.
‹Input id =" mybutton "type =" button "value =" clickMe "/›
Вот как это можно сделать на JavaScript:
document.getElemementById («mybutton»). addEventListener («click», function () {
alert («Эй, ты меня нажал?»);
});
То же самое нельзя сделать в jQuery, используя следующую строку кода.
$ (‘# Mybutton’). Click (function () {
alert («Эй, ты меня нажал?»);
});
Другой пример, быстрое веб-приложение:
Ajax - это асинхронный JavaScript и XML. По сути, это набор методов веб-разработки, используемых на стороне клиента для создания асинхронных веб-приложений. XMLHttpRequest (XHR) - это объект JavaScript, используемый для отправки HTTP-запросов на веб-сервер и загрузки ответа сервера обратно в сценарий. Затем этот ответ может быть обработан клиентом.
Здесь мы создаем простое приложение, которое отправляет запрос на сервер, чтобы получить текущую дату и время, и как только приходит ответ, ответ отображается в теге ‹div›, уже добавленном на HTML-страницу. Давайте посмотрим, насколько будет отличаться его кодирование при кодировании с помощью JavaScript и jQuery.
Вот сценарий на стороне сервера на php, сохраненный с именем getDateTimeServerScript.php, который возвращает текущую дату и время.
‹? Php
date_default_timezone_set («Азия / Калькутта»);
эхо-дата (‘Y-m-d H: i: s’);
?>
Версия JavaScript:
Это версия JavaScript веб-страницы (JavaScript.html):
‹! DOCTYPE html›
‹Html›
‹Script›
function loadCurrentDateTime () {
var xhttp = новый XMLHttpRequest ();
xhttp.onreadystatechange = function () {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById («область результатов»). innerHTML = xhttp.responseText;
}
}
xhttp.open («ПОЛУЧИТЬ», «getDateTimeServerScript.php», true);
xhttp.send ();
}
‹/Script›
‹Button type =” button ”onclick =” loadCurrentDateTime () ”› Загрузить текущую дату и время ‹/button›
‹Div id =” resultarea ”› ‹/div›
‹/Html›
Версия JQuery:
Это jQuery-версия той же веб-страницы (JQuery.html).
‹! DOCTYPE html›
‹Html›
‹Скрипт src =” https://code.jquery.com/jquery-2.1.4.min.js ›‹/script›
‹Script›
function loadCurrentDateTime () {
$ .ajax ({
тип: «ПОЛУЧИТЬ»,
url: «getDateTimeServerScript.php»,
кеш: ложь,
успех: функция (данные) {
$ («# Resultarea»). Текст (данные);
}
});
}
‹/Script›
‹Button type =” button ”onclick =” loadCurrentDateTime () ”› Загрузить текущую дату и время ‹/button›
‹Div id =” resultarea ”› ‹/div›
‹/Html›
Написанные выше коды JavaScript и jQuery делают то же самое, но javascript делает это, создавая объект XMLHttpRequest, а затем обрабатывая запрос, отправляя его на сервер и затем отображая ответ обратно в div «области результатов».
В то время как в коде jQuery то же самое делает библиотека jQuery, которая была включена в код с помощью строки
‹Скрипт src =” https://code.jquery.com/jquery-2.1.4.min.js ›‹/script›
Эта библиотека предлагает различные функции предварительной сборки для AJAX. Один из них - $ .ajax. Параметры запроса были переданы, и ответ собран в его функции обратного вызова успех.
Вывод скриншотов из примера веб-приложения:
На этом снимке экрана показана версия веб-приложения для JavaScript.
На этой странице есть кнопка, которая при нажатии инициирует запрос к серверу, который вычисляет текущую дату и время и отправляет его обратно клиенту в качестве ответа. Затем этот ответ добавляется к уже определенному тегу ‹div› и отображает дату и время. Дата и время соответствуют часовому поясу «Азия / Калькутта», как определено в сценарии на стороне сервера, упомянутом выше.
Вот еще один снимок экрана, отображающий вывод jQuery-версии веб-приложения.
Как и ожидалось, выходные данные версии JQuery и JavaScript одинаковы. Отличие заключается во внутренней реализации кода.
Что лучше всего подходит для моего проекта?
Самый важный момент, который следует учитывать, прежде чем переходить к выводу, какой язык использовать, заключается в том, что поскольку и JavaScript, и jQuery внутренне одинаковы, любой из них может использоваться для воссоздания того же эффекта, что и другой код. Следовательно, нет смысла проводить много споров о том, подходит ли JavaScript или jQuery для конкретного проекта или задачи.
Однако, если нужно выбрать один язык по выбору, jQuery обычно более чем достаточно для всех веб-приложений и проектов, и, следовательно, jQuery удерживает флаг победы, поскольку он может выполнять ту же задачу с меньшим количеством строк кода по сравнению с к основному коду JavaScript.
Если вы начинающий разработчик, вам действительно следует потратить много времени на изучение всех концепций JavaScript и создать несколько проектов с использованием основного JavaScript и воздержаться от использования jQuery на начальном этапе. Действительно полезно сначала понять, как JavaScript взаимодействует со структурой HTML-страницы и как он может работать в различных возможных сценариях.
Заключение
jQuery делает вещи настолько простыми и точными, что экономит время и ускоряет время разработки, а также позволяет разработчику больше сосредоточиться на реализации бизнес-логики, которую должен выполнять проект. Тем не менее, желательно глубоко и основательно изучить оба языка и решить самостоятельно, какой из них использовать в зависимости от данного сценария.
Меня зовут Ашиш @ ashish_fagna. Я разработчик программного обеспечения. Если вам понравилась эта статья, порекомендуйте и поделитесь ею! Спасибо за уделенное время.
