Какво са ES модулите?

ES-модулите са стандартен начин за организиране на кода в JavaScript, базиран на синтаксиса import и export.

Основни характеристики:

• Стандарт: Част от спецификацията ECMAScript, поддържана от повечето съвременни браузъри и среди за изпълнение като Node.js.
• Явно управление на зависимости: Модулите ясно посочват кои стойности експортират и кои импортират от други модули.
• Статична структура: Зависимостите на модулите се определят по време на компилация (или парсинг), а не при изпълнение. Това позволява на инструментите за статичен анализ, като бандлъри (Webpack, Rollup), да оптимизират кода.
• Изолация: Всяка променлива, функция или клас, обявени вътре в модула, по подразбиране са локални за този модул. За да бъдат достъпни отвън, трябва ясно да бъдат експортирани.
• Поддръжка на асинхронност: Модулите могат да се зареждат асинхронно в браузърите, без да блокират зареждането на страницата.

Синтаксис:

• Експорт:

  // app.js
  export const myVariable = 123; // Именован експортиране
  export function myFunction() { // Именован експортиране
    console.log('Hello from module!');
  }
  export default class MyClass { // Експорт по подразбиране
    constructor() {
      console.log('MyClass instance created');
    }
  }
  

• Импорт:

  // main.js
  import { myVariable, myFunction } from './app.js'; // Именован импорт
  import MyDefaultClass from './app.js'; // Импорт по подразбиране
  
  console.log(myVariable); // 123
  myFunction(); // Hello from module!
  const instance = new MyDefaultClass(); // MyClass instance created
  

Сравнение с CommonJS (Node.js):

Особеност	ES-модули	CommonJS
Синтаксис	import, export	require, module.exports, exports
Зависимости	Статични (определят се преди изпълнение)	Динамични (определят се по време на изпълнение)
Зареждане	Асинхронно (в браузърите)	Синхронно
this в корена	undefined	module.exports
Поддръжка	Браузъри, Node.js (по подразбиране от версия 13.2, чрез флаг --experimental-modules преди това)	Основно Node.js

Използването на ES-модулите е препоръчителният подход за съвременната фронтенд разработка поради стандартизацията им, по-добрата поддръжка от инструментите и възможността за статичен анализ.