02. Export

Модуль может экспортировать любые объявления элементов - var, let, const, class, функции и т.д. Экспорт может выполняться как в момент объявления элемента, так и после него.

Существует две разновидности экспорта (их можно смешивать, ):

  • Именованный экспорт - когда в модуле несколько экспортов.

  • Default экспорт - один экспорт на весь модуль.

    Эти два способа можно совмещать в одном модуле, но не рекомендуется.

Технически говоря, можно использовать именованный экспорт для одного модуля, но так желательно делать если API модуля в будущем будет расширяться. Если модуль экспортирует действительно "одну вещь", то default-экспорт является предпочтительным способом использования.

Named export

Именованный экспорт экспортирует любое объявление по его имени. Для экспорта перед объявлением элемента добавляется ключевое слово export:

//------ lib.js ------
export const sqrt = Math.sqrt;
export function square(x) {
  return x * x;
}
export function diag(x, y) {
  return sqrt(square(x) + square(y));
}

//------ main.js ------
import { square, diag } from "lib";
console.log(square(11)); // 121
console.log(diag(4, 3)); // 5

При импорте, поиск значения выполняется по его имени при экспорте, откуда и название.

Ключевое слово export можно использовать отдельно, при этом в фигурных скобках указывается, что именно экспортируется.

// экспорт переменной
let one = 1;
let two = 2;
export { two };

// экспорт двух переменных
export { one, two };

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

// экпорт переменных с переименованием
export { one as once, two as twice };

Default export

Для ситуации, когда модуль экспортирует ровно одно значение, предусмотрено особое ключевое сочетание export default. Если поставить после export слово default, то значение станет “экспортом по умолчанию”. Такое значение можно импортировать без фигурных скобок:

//------ square.js ------
export default function(x) {
  return x * x;
}

//------ main1.js ------
import squareFn from "square";

Технически, после export default может стоять любое выражение, результат которого экспортируется в виде служебной переменной со специальным именем default:

export default «expression»;

//That is equivalent to:
const __default__ = «expression»;
export { __default__ as default }; // (A)

Если операндом default export является выражение не имеющее собственного имени, то при импорте оно будет идентифицировано через имя модуля.

//------ MyClass.js ------
export default class { ... };

//------ main2.js ------
import MyClass from 'MyClass';
let inst = new MyClass();

Mixed export

Можно иметь как named export так и default export в одном файле:

//------ underscore.js ------
 export default function (obj) {
     ...
 };
 export function each(obj, iterator, context) {
     ...
 }
 export { each as forEach };

 //------ main.js ------
 import _, { each } from 'underscore';

Re-export

Re-exporting means adding another module’s exports to those of the current module.

You can either add all of the other module’s exports:

export * from "src/other_module";

Or you can be more selective (optionally while renaming):

export { foo, bar } from "src/other_module";
// Renaming: export other_module’s foo as myFoo
export { foo as myFoo, bar } from "src/other_module";

Default exports are ignored by export *. The following statement makes the default export of another module foo the default export of the current module:

export { default } from "foo";

The following statement makes the named export myFunc of module foo the default export of the current module:

export { myFunc as default } from "foo";

Last updated