Что такое модули?

Когда ваш JavaScript-код становится большим и сложным, управлять всем в одном файле становится трудно. Решение — это модули: разделение вашего кода на отдельные, организованные файлы.

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

JavaScript-модуль — это обычный .js файл, который может экспортировать код (переменные, функции, классы), чтобы другие файлы могли его импортировать и использовать.

Пример:

Один запутанный файл:

// файл: messy-app.js
let user = "John";
let score = 0;

function login() {
  console.log("Welcome " + user);
}

function addPoints(points) {
  score += points;
}

Два файла, организованных с помощью модулей:

// файл: user-module.js
let user = "John";
function login() {
  console.log("Welcome " + user);
}
// файл: game-module.js  
let score = 0;
function addPoints(points) {
  score += points;
}

user-module.js — он обрабатывает аутентификацию пользователей и данные, связанные с пользователями, а также содержит имя пользователя и функциональность входа.

game-module.js — он управляет системой начисления очков и игровым счетом, а также отслеживает счет и обрабатывает расчет очков.