Que signifie exporter en javascript

En JavaScript, exporter signifie "exporter" ; toutes les déclarations au sein d'un module en JavaScript sont locales. Le mot-clé export peut être utilisé pour exporter le module. Cette commande peut apparaître n'importe où dans le module. peut charger le module via la commande import.

L'environnement d'exploitation de ce tutoriel : système Windows 10, JavaScript version 1.8.5, ordinateur Dell G3.

Que signifie exporter en javascript ?

Par défaut, toutes les déclarations en JavaScript au sein d'un module sont locales et ne sont pas accessibles en externe. Si vous devez exposer une partie du contenu déclaré dans le module et laisser d'autres modules l'utiliser, vous devez exporter la fonction. Le moyen le plus simple consiste à ajouter le mot-clé export pour exporter le module.

Le contenu pouvant être exporté comprend des classes, des fonctions et des variables modifiées par var, let et const. La commande d'exportation peut apparaître n'importe où dans le module, à condition qu'elle se trouve au niveau supérieur du module. S'il s'agit d'une portée au niveau du bloc, une erreur sera signalée, tout comme la commande d'importation.

Après avoir utilisé la commande export pour définir l'interface externe du module, d'autres fichiers JS peuvent charger ce module via la commande import.

La commande d'importation a un effet liftant et sera promue à la tête de l'ensemble du module et exécutée en premier. L'importation étant exécutée de manière statique, les expressions et les variables ne peuvent pas être utilisées. Il s'agit de structures syntaxiques dont les résultats ne peuvent être obtenus qu'au moment de l'exécution.

1. Import/export par défaut import/export par défaut

Chaque module n'a qu'une seule exportation par défaut, et le contenu de l'exportation peut être une fonction, une classe, un objet, etc. Étant donné que cette méthode est considérée comme le principal contenu d'exportation, la méthode d'importation est la plus simple.

// 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 };

Remarque : un module n'est autorisé à exporter qu'un seul objet par défaut. Ce qui est réellement exporté est une variable nommée default pour le renommer. Par conséquent, n’importe quel nom de variable peut être utilisé après l’importation et {} n’est pas obligatoire.

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

2. Import et export nommés

Il est à noter que la commande export spécifie l'interface externe et doit établir une correspondance biunivoque avec les variables à l'intérieur du module. De plus, l'interface sortie par l'instruction d'exportation a une relation de liaison dynamique avec sa valeur correspondante, c'est-à-dire que grâce à cette interface, la valeur en temps réel à l'intérieur du module peut être obtenue.

La commande import accepte une paire d'accolades, qui spécifient les noms de variables à importer depuis d'autres modules. Le nom de la variable entre accolades doit être le même que le nom de l’interface externe du module importé (profile.js). Si vous souhaitez renommer la variable d'entrée, utilisez le mot-clé as dans la commande d'importation pour renommer la variable d'entrée.

Le "from" après l'importation spécifie l'emplacement du fichier du module, qui peut être un chemin relatif ou un chemin absolu. Le chemin .js peut être omis. S'il s'agit uniquement du nom du module sans chemin, alors il doit y avoir un fichier de configuration pour indiquer au moteur JavaScript l'emplacement du module.

// 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. Renommer l'importation et l'exportation

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

Lors de l'importation du contenu d'exportation de différents modules, le caractère unique du nom doit être conservé. Ce problème peut être résolu en renommant les deux catégories suivantes.

//导出的时候重命名
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. Écriture composée d'exportation et d'importation

Si dans un module, le même module est d'abord entré puis sorti, l'instruction d'importation peut être écrite avec l'instruction d'exportation.

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

【Recommandations associées : Tutoriel d'apprentissage Javascript】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!