export

Het export statement wordt gebruikt bij het maken van JavaScript modules om functies, objecten of primitieve waarden te exporteren van de module zodat deze gebruikt kunnen worden door andere programmas met het import statement.

Geëxporteerde modules worden altijd uitgevoerd in strict mode, ongeacht of dat is aangegeven. Het export-statement kan niet gebruikt worden in ingevoegde scripts.

Syntax

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

export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also 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

Identificator die geëxporteerd moet worden (zodat het geïmporteerd kan worden via import in een ander script).

Beschrijving

Er zijn 2 verschillende types van export: named en default. Er kunnen meerdere named exports per module bestaan, maar slechts een default export. Elk type komt overeen met een van de bovenstaande syntaxen.

• Genoemde exports (named exports):

  // exporteert een eerder gedeclareerde functie
  export { myFunction }; 
  
  // exporteert een constante
  export const foo = Math.sqrt(2);

• Standaard exports (default exports) (function):

  export default function() {} 

• Standaard exports (default exports) (class):

  export default class {} 

Genoemde exports zijn handig om verschillende waardes te exporteren. Tijdens de import is het verplicht om dezelfde naam als het overeenkomende object te gebruiken.

Maar een standaard export kan geïmporteerd worden met enige andere naam, bijvoorbeeld:

let k; export default k = 12; // in bestand test.js

import m from './test' // let op dat we de vrijheid hebben om import m te gebruiken in plaats van import k, omdat k een default export is.

console.log(m);        // Zal '12' in de console laten zien

Er kan slechts 1 standaard export zijn.

De volgende syntax exporteert geen standaard export van de geïmporteerde module:

export * from …;

Gebruik de volgende syntax als de standaard export nodig is:

export {default} from 'mod';

Voorbeelden

Genoemde (named) exports gebruiken

In de module zouden we de volgende code kunnen gebruiken:

// module "my-module.js"
function cube(x) {
  return x * x * x;
}
const foo = Math.PI + Math.SQRT2;
export { cube, foo };

Op deze manier zouden we in een ander script deze code kunnen hebben:

import { cube, foo } from 'my-module';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

De standaard (default) export gebruiken

Als we een enkele waarde willen exporteren of willen terugvallen op een waarde voor onze module zouden we een standaard (default) export kunnen gebruiken:

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

Op die manier zal het vanzelfsprekend zijn om in een ander script de standaard (default) export te importeren:

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

Merk op dat het niet mogelijk is om var, let of const te gebruiken met export default.

Specificaties

Browser compatibiliteit

Bekijk ook

• import
• ES6 in Depth: Modules, Hacks blog post by Jason Orendorff
• Axel Rauschmayer's book: "Exploring JS: Modules"