los export La declaración se utiliza al crear módulos JavaScript para exportar enlaces en vivo a funciones, objetos o valores primitivos del módulo para que puedan ser utilizados por otros programas con la import declaración. Los enlaces que se exportan aún se pueden modificar localmente; cuando se importan, aunque solo pueden ser leídos por el módulo de importación, el valor se actualiza cada vez que lo actualiza el módulo de exportación.

Los módulos exportados están en modo estricto, ya sea que los declare como tales o no. La declaración de exportación no se puede utilizar en scripts incrustados.

Sintaxis

Hay dos tipos de exportaciones:

  1. Exportaciones con nombre (cero o más exportaciones por módulo)
  2. Exportaciones predeterminadas (una por módulo)
// Exporting individual featuresexportlet name1, name2,, nameN;// also var, constexportlet name1 =, name2 =,, nameN;// also var, constexportfunctionfunctionName()...exportclassClassName...// Export listexport name1, name2,, nameN ;// Renaming exportsexport variable1 as name1, variable2 as name2,, nameN ;// Exporting destructured assignments with renamingexportconst name1, name2: bar = o;// Default exportsexportdefault expression;exportdefaultfunction()// also class, function*exportdefaultfunctionname1()// also class, function*export name1 asdefault,;// Aggregating modulesexport* from …;// does not set the default exportexport*as name1 from …;// Draft ECMAScript® 2O21export name1, name2,, nameN  from …;export import1 as name1, import2 as name2,, nameN  from …;exportdefault, from …;
nameN
Identificador a exportar (para que se pueda importar a través de import en otro guión).

Descripción

Hay dos tipos diferentes de exportación, llamado y defecto. Puede tener varias exportaciones con nombre por módulo, pero solo una exportación predeterminada. Cada tipo corresponde a una de las sintaxis anteriores:

Exportaciones nombradas:

// export features declared earlierexport myFunction, myVariable ;// export individual features (can export var, let,// const, function, class)exportlet myVariable = Math.sqrt(2);exportfunctionmyFunction()...;

Exportaciones predeterminadas:

// export feature declared earlier as defaultexport myFunction asdefault;// export individual features as defaultexportdefaultfunction()...exportdefaultclass..// each export overwrites the previous one

Las exportaciones con nombre son útiles para exportar varios valores. Durante la importación, es obligatorio utilizar el mismo nombre del objeto correspondiente.

Pero una exportación predeterminada se puede importar con cualquier nombre, por ejemplo:

// file test.jslet k;exportdefault k =12;
// some other fileimport m from'./test';// note that we have the freedom to use import m instead of import k, because k was default export
console.log(m);// will log 12

También puede cambiar el nombre de las exportaciones con nombre para evitar conflictos de nombres:

export myFunction as function1,
         myVariable as variable ;

Reexportación / Agregación

También es posible “importar / exportar” desde diferentes módulos en un módulo principal para que estén disponibles para importar desde ese módulo. En otras palabras, se puede crear un solo módulo concentrando varias exportaciones de varios módulos.

Esto se puede lograr con la sintaxis “exportar desde”:

exportdefaultas function1,
         function2 from'bar.js';

Que es comparable a una combinación de importación y exportación:

importdefaultas function1,
         function2 from'bar.js';export function1 asdefault, function2 ;

Pero donde function1 y function2 no estén disponibles dentro del módulo actual.

Nota: Lo siguiente es sintácticamente inválido a pesar de su equivalente de importación:

import DefaultExport from'bar.js';// Valid
export DefaultExport from'bar.js';// Invalid

La forma correcta de hacer esto es cambiar el nombre de la exportación:

exportdefaultas DefaultExport from'bar.js';

La sintaxis “export from” permite as token que se omitirá; sin embargo, esto significará que el elemento predeterminado no se puede importar como una importación con nombre:

exportdefault, function2 from'bar.js';

Ejemplos de

Usar exportaciones con nombre

En un modulo my-module.js, podríamos incluir el siguiente código:

// module "my-module.js"functioncube(x)return x * x * x;const foo = Math.PI+ Math.SQRT2;var graph =
  options:
      color:'white',
      thickness:'2px',draw:function()
      console.log('From graph draw function');export cube, foo, graph ;

Luego, en el módulo de nivel superior incluido en su página HTML, podríamos tener:

import cube, foo, graph from'./my-module.js';

graph.options =
    color:'blue',
    thickness:'3px';

graph.draw();
console.log(cube(3));// 27
console.log(foo);// 4.555806215962888

Es importante tener en cuenta lo siguiente: