Что такое JavaScript и зачем он нужен

Прежде чем копаться в истории, посмотрите, как мало нужно, чтобы написать первую программу на JavaScript:

// Ваша первая строка на JavaScript
console.log("Привет, JavaScript!");

В 1995 году компания Netscape выпускала самый популярный браузер того времени — Navigator. Страницы тогда были неподвижными, как журнальный разворот: текст, картинки и ни одной живой детали. Netscape захотела встроить в браузер язык, на котором смогут писать не только профессионалы, и поручила задачу инженеру Брендану Айку. Первую версию он собрал примерно за десять дней — рекордный срок для языка, который потом захватит весь веб.

С названием вышла забавная история. Язык не имеет почти ничего общего с Java, но Java в тот момент была самой модной технологией — и имя JavaScript выбрали ради шумихи в прессе. Маркетинговый трюк сработал слишком хорошо: путаница живёт до сих пор.

Java и JavaScript — родня не больше, чем гвоздь и гвоздика

JavaScript выполняется везде, где установлен его движок — специальная программа-исполнитель. Сначала движки жили только внутри браузеров. В 2009 году появился Node.js: движок вынесли из браузера, и JavaScript научился работать на серверах. Дальше язык добрался до телефонов и настольных программ.

Получается редкая ситуация: один язык покрывает все основные платформы. Выучив JavaScript, вы сможете собрать и сайт, и сервер к нему, и мобильное приложение — не переучиваясь.

У JavaScript на странице три суперспособности. Первая — реагировать на действия пользователя: клики, нажатия клавиш, движение мыши. Вот упрощённая модель того, что происходит, когда вы жмёте кнопку «Нравится»:

let clicks = 0;
function handleClick() {
  clicks = clicks + 1;
  console.log(`Кликов: ${clicks}`);
}
handleClick();
handleClick();

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

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

Движок — это программа, которая читает ваш код и выполняет его. Самый известный — V8: он работает в Chrome, Edge и Node.js. В Firefox трудится SpiderMonkey, в Safari — JavaScriptCore. Современные движки на лету превращают JavaScript в машинные инструкции, поэтому даже тяжёлые вычисления пролетают незаметно:

// Миллион сложений — движок справится мгновенно
let sum = 0;
for (let i = 0; i < 1000000; i++) {
  sum += i;
}
console.log(sum);

Чтобы все движки понимали код одинаково, язык описан стандартом ECMAScript. За него отвечает комитет TC39, и с 2015 года новая версия стандарта выходит каждый год: ES2015, ES2016 и так далее. Браузеры подтягивают свежие возможности с небольшим отставанием.

Первая причина — монополия. Управлять страницей браузер из коробки позволяет только одному языку — JavaScript. Другие языки попадают на страницу компиляцией — в JavaScript или в WebAssembly, второй формат, который браузеры исполняют нативно; но и WebAssembly сам не слушает клики и не меняет страницу — для этого ему нужен JavaScript. Хотите делать интерактивные сайты — обойти его не получится.

Вторая причина — экосистема, крупнейшая в мире программирования: миллионы готовых пакетов в npm, огромное сообщество и ответ почти на любой вопрос уже где-то написан. А порог входа минимальный: не нужно ничего устанавливать, редактор кода и браузер уже у вас есть.

const skills = ["сайты", "серверы", "мобильные приложения"];
console.log(`Один язык — и вы делаете: ${skills.join(", ")}`);