exports und imports in JavaScript

JavaScript hat seit ECMAScript 2015 eine offizielle für import- und export-Anweisungen. Damit lassen sich JavaScript-Projekte auf mehrere Dateien aufteilen um eine übersichtliche Code-Struktur zu erhalten und z.B. Funktionen in anderen Dateien im Code zu verwenden. Somit können Funktionen oder Klassen in einer bestimmtem Datei deklariert und exportiert werden, um sie in einer anderen Datei zu importieren und dort zu verwenden.

Vorbereitungen in replit und NodeJS

Um import/export in replit oder NodeJS verwenden zu können, muss diese Funktionalität folgendermaßen aktiviert werden:

1. Falls noch nicht vorhanden, im Projektordner die Datei package.json erstellen:

• In replit.com sollte diese schon vorhanden sein.
• In NodeJS kann diese mit npm init erstellt werden.

2. Die Datei package.json öffnen.
3. In package.json folgendes eintragen (z.B. nach dem Eintrag für version):

// in package.json hinzufügen:
"type": "module",

Die Datei package.json sollte dann z.B. so aussehenn:

{
  "name": "myproject",
  "version": "1.0.0",
  "type": "module",
  "description": "",
  "main": "index.js",

  // usw.
}

 "type": "module",

Exportieren (von Funktionen o.a.)

Nun kann z.B. in einer Datei util/computations.js etwas exportiert werden:

// in util/computations.js
export function test1() { return 'TEST1'; };
export function test2() { return 'TEST2'; };
export default function test() { return 'TEST'; };
 
const myConstant = 1234;
export { myConstant };

Bei Funktionen kann also direkt vor function mit export angezeigt werden, dass diese Funktion exportiert werden soll. Pro Datei (bzw. Modul) kann es höchstens eine export default-Anweisung geben.

Im obigen Beispiel werden drei Funktionen exportiert. Dies ist auch mit Klassen oder Konstanten möglich, wobei die Konstanten zunächst initialisiert und dann exportiert werden müssen, wie oben in den letzten zwei Zeilen zu sehen.

Importieren (von Funktionen o.a.)

Importiert werden die „normalen“ Exports durch Angabe der Namen in geschweiften Klammen (hier test2 und test3). Der „Default“-Export kann ohne geschweifte Klammern angegeben werden (hier ist dies test):

// z.B in index.js importieren:
import test, { test1, test2, myConstant } from './util/computations.js';
 
console.log(test());
console.log(test1());
console.log(test2());
console.log(myConstant);

Anstatt die importierenden Artefakte (Funktionen, Konstanten, usw.) einzeln in geschweiften Klammern aufzulisten, ist es mit * as Name möglich, alle exportieren Artefakte unter einem qualifizierenden Namen (Name) zu importieren:

// z.B in index.js importieren:
import test, * as Comp from './util/computations.js';
 
console.log(test());
console.log(Comp.test1());
console.log(Comp.test2());
console.log(Comp.myConstant);

⟶ Hier stehen die „normalen“ Exports (ohne default) alle unter dem Namen Comp zur Verfügung.

node --experimental-specifier-resolution=node index