Was bedeutet Export in Javascript?

Export bedeutet in JavaScript „Exportieren“. Das Modul kann mit dem Schlüsselwort „export“ an einer beliebigen Stelle exportiert werden Laden Sie das Modul über den Importbefehl.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Was bedeutet Export in Javascript?

Standardmäßig sind alle Deklarationen in JavaScript innerhalb eines Moduls lokal und können von außen nicht aufgerufen werden. Wenn Sie einen Teil des deklarierten Inhalts im Modul verfügbar machen und ihn von anderen Modulen verwenden lassen müssen, müssen Sie die Funktion exportieren. Der einfachste Weg besteht darin, das Schlüsselwort export hinzuzufügen, um das Modul zu exportieren.

Der Inhalt, der exportiert werden kann, umfasst Klassen, Funktionen und Variablen, die durch var, let und const geändert wurden. Der Exportbefehl kann überall im Modul erscheinen, solange er sich auf der obersten Ebene des Moduls befindet. Wenn es sich im Bereich auf Blockebene befindet, wird ein Fehler gemeldet, ebenso wie beim Importbefehl.

Nachdem der Exportbefehl zum Definieren der externen Schnittstelle des Moduls verwendet wurde, können andere JS-Dateien dieses Modul über den Importbefehl laden.

Der Importbefehl hat einen Lifting-Effekt und wird an die Spitze des gesamten Moduls befördert und zuerst ausgeführt. Da der Import statisch ausgeführt wird, können Ausdrücke und Variablen nicht verwendet werden. Dabei handelt es sich um Syntaxstrukturen, deren Ergebnisse nur zur Laufzeit erhalten werden können.

1. Standardimport/-export Standardimport/-export

Jedes Modul verfügt nur über einen Standardexport und der Exportinhalt kann eine Funktion, Klasse, ein Objekt usw. sein. Da diese Methode als Hauptexportinhalt gilt, ist die Importmethode die einfachste.

// there is no semi-colon here
export default function() {} 
export default class {}
//示例
class A extends Component{
   ...
}
export default A;
//对应的import示例。
import A from './requireTest'
//default export, 输入 lodash 模块
import _ from 'lodash';
//一条import语句中，同时输入默认方法和其他变量
import _, { each } from 'lodash';
//上述代码对应的export语句
export default function (obj) {
  // ···
}
export function each(obj, iterator, context) {
  // ···
}
export { each as forEach };

Hinweis: Ein Modul darf nur ein Standardobjekt exportieren, um es umzubenennen. Daher kann nach dem Import jeder Variablenname verwendet werden und {} ist nicht erforderlich.

import any from './requireTest'
import {default as any } from './requireTest'

2. Benannter Import und Export

Es ist zu beachten, dass der Exportbefehl die externe Schnittstelle angibt und eine Eins-zu-eins-Entsprechung mit den Variablen innerhalb des Moduls herstellen muss. Darüber hinaus steht die von der Exportanweisung ausgegebene Schnittstelle in einer dynamischen Bindungsbeziehung mit dem entsprechenden Wert, dh über diese Schnittstelle kann der Echtzeitwert innerhalb des Moduls abgerufen werden.

Der Importbefehl akzeptiert ein Paar geschweifte Klammern, die die Variablennamen angeben, die aus anderen Modulen importiert werden sollen. Der Variablenname in den geschweiften Klammern muss mit dem Namen der externen Schnittstelle des importierten Moduls (profile.js) übereinstimmen. Wenn Sie die Eingabevariable umbenennen möchten, verwenden Sie das Schlüsselwort as im Importbefehl, um die Eingabevariable umzubenennen.

Das „von“ nach dem Import gibt den Speicherort der Moduldatei an, der ein relativer Pfad oder ein absoluter Pfad sein kann. Der .js-Pfad kann weggelassen werden. Wenn es sich nur um den Modulnamen ohne Pfad handelt, muss eine Konfigurationsdatei vorhanden sein, um der JavaScript-Engine den Speicherort des Moduls mitzuteilen.

// profile.js
//第一种export
export var firstName = 'Michael';
export function f() {};
//第二种export，优先使用这种写法
var firstName = 'Michael';
export {firstName}；
function f() {}
export {f};
//main.js
import { firstName, f } from './profile';
import { firstName as surname } from './profile';

3. Import und Export umbenennen

export { myFunction }; // exports a function declared earlier
export const foo = Math.sqrt(2); // exports a constant

Beim Importieren der Exportinhalte verschiedener Module muss die Eindeutigkeit der Benennung gewahrt bleiben. Dies kann durch Umbenennung gelöst werden, einschließlich der folgenden zwei Kategorien.

//导出的时候重命名
function v1() { ... }
function v2() { ... }
export {
      v1 as streamV1,
      v2 as streamV2,
      v2 as streamLatestVersion  //可以用两个不同的名称导出相同的值
};
//导入的时候重命名
// 这两个模块都会导出以`flip`命名的东西。同时导入两者，需要将其中一个的名称改掉。
import {flip as flipOmelet} from "eggs.js";
import {flip as flipHouse} from "real-estate.js";

4. Zusammengesetztes Schreiben von Export und Import

Wenn in einem Modul dasselbe Modul zuerst eingegeben und dann ausgegeben wird, kann die Importanweisung zusammen mit der Exportanweisung geschrieben werden.

export { foo, bar } from 'my_module';
// 等同于
import { foo, bar } from 'my_module';
export { foo, bar };

【Verwandte Empfehlungen: Javascript-Lern-Tutorial】

Das obige ist der detaillierte Inhalt vonWas bedeutet Export in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!