Главный язык программирования для фронтендера: зачем учить JavaScript

JavaScript — это язык программирования, который в первую очередь применяют в вебе. С его помощью сайты делают интерактивными: добавляют всплывающие окна, анимацию, кнопки лайков и формы для отправки информации. Его ещё называют главным языком фронтенда — «лицевой» стороны сайта, с которой взаимодействуют пользователи.

JavaScript похож на Java, Python, Go, C#, но имеет свои особенности:

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

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

2. Мультипарадигменный. В программировании существует несколько парадигм:

● Объектная. В ней для каждой сущности в коде, например кнопки заказа, создают объекты. А затем прописывают связи между этими объектами.
● Функциональная. В ней больше внимания уделяют конкретным инструкциям. Кнопка здесь — не объект, в коде она обозначена как порядок действий, которые происходят после нажатия.
● Императивная. Здесь код пишут как чёткий набор инструкций, который выполняется строго последовательно. Императивная и функциональная парадигма часто применяются вместе.

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

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

У языка JavaScript типизация динамическая — в переменную можно положить что угодно. Это облегчает написание кода, но может вызвать ошибки. Например, JavaScript позволит сравнить строку с числом и даже выдаст какой-то результат. Что больше, «корова» или «81»? JavaScript знает ответ.

4. Интегрирован с HTML и CSS в браузерах. HTML и CSS — это языки разметки для сайтов. Они не относятся к языкам программирования, так как не позволяют писать функции и что-то обрабатывать. С их помощью задают внешний вид сайта: расположение блоков, размер шрифта, цвета. Чтобы сайт стал интерактивным, нужен язык программирования, и JavaScript тут подходит идеально. Современные браузеры позволяют просто вписать код на JavaScript прямо в разметку, написанную на HTML и CSS, — и всё заработает.

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

5. Подходит для бэкенда. Код JavaScript можно запускать и в браузере, и на сервере. Это значит, что на нём можно писать не только интерактивные элементы страниц, но и серверную часть сайта: функции обработки данных и вычислений. Правда, для этого нужно освоить отдельный инструмент — Node.js. Это движок, который позволяет запускать JavaScript не в браузере, а на сервере.

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

● Сделать сайт интерактивным — чтобы это была не просто статичная страница, а динамичная программа, реагирующая на действие пользователей. Например, если нажать кнопку «Нравится» и число лайков на записи увеличивается сразу, без обновления страницы. Это результат использования JavaScript.

Интерактивные элементы на сайте сделаны с помощью JavaScript

● Передавать информацию между пользователем и сервером. Именно скрипты, написанные на JavaScript, отправляют на сервер информацию, которую ввёл пользователь.
● Анимировать объекты — добавить скролл до раздела по нажатию кнопки, анимацию фона, движущиеся объекты.
● Производить вычисления. Например, в онлайн-калькуляторе на сайте. Это можно делать как на стороне сервера, так и в самом браузере с помощью возможностей JavaScript.
● Писать серверную часть сайта или приложения.

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

Веб-сайты и веб-приложения. Самая популярная область применения языка JavaScript — это написание кода для сайта. Практически на каждом современном сайте используют код, написанный на JS.

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

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

Серверная часть сайтов и программ. Язык программирования JavaScript можно использовать для написания любых сервисов: чатов, компьютерных программ и даже нейросетей. Для этого к нему нужно подключить движок Node.js.

Игры. На JS можно писать несложные браузерные игры. Вот интересный платформер с необычной физикой.

Сам по себе JavaScript не может чего-то уметь или не уметь — это просто язык программирования. Его возможности зависят от того, что именно ему позволяет браузер. В современных браузерах JavaScript-код может:

● Изменить уже существующий на странице HTML-код или добавить новый, поменять стили. Например, сменить цвет шапки.
● Среагировать на щелчок мыши, перемещение указателя, нажатие клавиш, прокрутку.
● Отправить сетевой запрос на сервер, скачать или загрузить файл. Например, взять присланную пользователем картинку и отправить её на сервер для хранения.
● Задавать пользователю вопросы и показывать сообщения.
● Запоминать данные и хранить их на стороне клиента, в его браузере. Например, сохранить документ в офлайн-режиме, пока пользователь не очистит кэш или не обновит страницу.

JavaScript изначально задумывали как безопасный язык. Браузер не позволяет ему глубоко влезать в работу компьютера пользователя и других веб-сайтов. Поэтому JS в браузере не умеет:

● Читать и записывать файлы на жёсткий диск пользователя, запускать программы, работать с системными функциями ОС. Ему доступно только то, что пользователь сам добровольно согласился загрузить через браузер. В некоторых браузерах, например Mozilla Firefox, функция чтения и записи уже появилась, но пока доступна не везде.
● Работать с камерой и микрофоном без разрешения пользователя.
● Взаимодействовать с другими окнами и вкладками. Для этого обе страницы должны «согласиться» с этим и иметь специальный код для обмена данными. Это защищает пользователя и не помогает неизвестному сайту взаимодействовать со вкладкой, где открыты, например, соцсети или почта.
● Легко получать данные от других сайтов и доменов. Это возможно с согласия другого сайта или сервера.

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

Тем, кто планирует стать фронтенд‑разработчиком, — однозначно стоит. Этот язык будет основным рабочим инструментом. Без JavaScript невозможно разрабатывать ту часть сайтов и веб-приложений, с которой взаимодействуют пользователи.

У JS есть и другие плюсы для изучения:

● Простой в изучении. Уже через пять минут можно написать и запустить свой первый скрипт. А через пару дней обучения собрать вполне рабочую программу, например расширение для браузера.
● Хорош как база. На нём можно освоить основы, единые для всех языков программирования. И потом перейти к изучению других. Особенно хорошо после JS идут «С-образные» языки: C++, C#, Java, PHP.
● Универсален. Если освоить Node.js, можно перейти с фронтенда на бэкенд или в другую сферу разработки.
● Актуален. JS был создан больше 20 лет назад, но всё ещё развивается и не сдаёт свои позиции как главный язык для фронтенда.
● Имеет множество надстроек. CoffeeScript, TypeScript и Dart и другие надстройки делают код компактнее, чище и строже. Их можно изучить, чтобы развиваться в сфере фронтенда.