export

La declaraci贸n export se utiliza al crear m贸dulos de JavaScript para exportar funciones, objetos o tipos de dato primitivos del m贸dulo para que puedan ser utilizados por otros programas con la sentencia import.

Los m贸dulos exportados est谩n en strict mode tanto si se declaran as铆 como si no. La sentencia export no puede ser utilizada en scripts embebidos.

Sintaxis

export { name1, name2,, nameN };
export { variable1 as name1, variable2 as name2,, nameN };
export let name1, name2,, nameN; // tambi茅n var
export let name1 =, name2 =,, nameN; // tambi茅n var, const
export function FunctionName(){...}
export class ClassName {...}

export default expression;
export default function () {} // tambi茅n class, function*
export default function name1() {} // tambi茅n class, function*
export { name1 as default,};

export * from;
export { name1, name2,, nameN } from;
export { import1 as name1, import2 as name2,, nameN } from;
export { default } from;
nameN
Identificador a ser exportado (es posible importarlo a trav茅s de import en otro script).

Descripci贸n

Existen dos tipos diferentes de exportaci贸n , nombrada y por defecto. Se pueden tener varias exportaciones nombradas por m贸dulo pero s贸lo una exportaci贸n por defecto. Cada tipo corresponde a una de las sintaxis siguientes:

  • Exports con nombre:
    // exporta la funci贸n previamente declarada
    export { myFunction };
    
    // exporta una constante
    export const foo = Math.sqrt(2);
  • Exports por defecto (function):
    export default function() {} 
  • Exports por defecto (class):
    export default class {} 

Los export con nombre son 煤tiles cuando se necesitan exportar m煤ltiples valores. Durante el import, es obligatorio usar el mismo nombre que el correspondiente objeto.

Pero un export por defecto puede ser importado con cualquier nombre, por ejemplo:

export default k = 12; // en el archivo test.js

import m from './test' // notese que tenemos la libertad de usar import m en lugar de import k, porque k era el export por defecto

console.log(m); // escribir谩 12

S贸lo puede haber un export por defecto.

La siguiente sintaxis no exporta un export por defecto del m贸dulo importado:

export * from;

Si necesita exportar por defecto, escriba lo siguiente en su lugar:

import mod from 'mod';
export default mod;

Ejemplos

Usando exports con nombre

En el m贸dulo, podremos usar el siguiente c贸digo:

// module "my-module.js"
function cube(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 };

De esta forma, en otro script, podemos tener:

//You should use this script in html with the type module ,
//eg ''<script type="module" src="demo.js"></script>",
//open the page in a httpserver,otherwise there will be a CORS policy error.
//script demo.js

import { cube, foo, graph } from 'my-module';
graph.options = {
    color:'blue',
    thickness:'3px'
};
graph.draw();
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

Usando el export por defecto

Si queremos exportar un s贸lo valor o tener uno por defecto para nuestro m贸dulo, podemos usar un export por defecto:

// module "my-module.js"
export default function cube(x) {
  return x * x * x;
}

De esta forma la importaci贸n de un export default ser谩 sumamemte sencilla:

import cube from 'my-module';
console.log(cube(3)); // 27

Tenga en cuenta que no es posible usar var, let o const con export default.

Especificaciones

Especificaci贸n Estado Comentario
ECMAScript 2015 (6th Edition, ECMA-262)
La definici贸n de 'Exports' en esta especificaci贸n.
Standard Definici贸n inicial.
ECMAScript (ECMA-262)
La definici贸n de 'Exports' en esta especificaci贸n.
Living Standard  

Compatiblidad en navegadores

BCD tables only load in the browser

Vea tambi茅n