---
sidebar_position: 1
---

# Модули

Основные понятия:
1. Модуль – это файл. Чтобы работал `import/export`, нужно для браузеров указывать атрибут `<script type="module"`>. У модулей есть ряд особенностей:
   - Отложенное (deferred) выполнение по умолчанию.
   - Атрибут async работает во встроенных скриптах.
   - Для загрузки внешних модулей с другого источника, он должен ставить заголовки CORS.
   - Дублирующиеся внешние скрипты игнорируются.
2. У модулей есть своя область видимости, обмениваться функциональностью можно через `import/export`.
3. В модулях всегда включена директива `use strict`.
4. Код в модулях выполняется только один раз. Экспортируемая функциональность создаётся один раз и передаётся всем импортёрам.

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

В реальной жизни часто используется сборщик Webpack, чтобы объединить модули: для производительности и других «плюшек».

Библиотеки для динамической подгрузки модулей.
- **AMD** – одна из самых старых модульных систем, изначально реализована библиотекой require.js.
- **CommonJS** – модульная система, созданная для сервера Node.js.
- **UMD** – ещё одна модульная система, предлагается как универсальная, совместима с AMD и CommonJS.

## Что такое модуль?
Модуль – это просто файл. Один скрипт – это один модуль.

Модули могут загружать друг друга и использовать директивы `export` и `import`, чтобы обмениваться функциональностью, вызывать функции одного модуля из другого:
- export отмечает переменные и функции, которые должны быть доступны вне текущего модуля.
- import позволяет импортировать функциональность из других модулей.
  
## Основные возможности модулей
- В модулях всегда используется режим use strict.
- Каждый модуль имеет свою собственную область видимости. 
- Если один и тот же модуль используется в нескольких местах, то его код выполнится только один раз, после чего экспортируемая функциональность передаётся всем импортёрам.
- Объект import.meta содержит информацию о текущем модуле. Содержимое зависит от окружения.
- В модуле на верхнем уровне this не определён (undefined).

🚀 **Источник: [https://learn.javascript.ru/modules-intro](https://learn.javascript.ru/modules-intro)**