JavaScript utilise-t-il également l'importation ?

Il existe une instruction d'importation en JavaScript. L'instruction import est utilisée pour importer des fonctions, des objets et des valeurs initiales exportées d'un module vers un autre module ; la syntaxe est "importer {nom du module} à partir de "le nom du chemin du module qui doit être importé"".

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

import est utilisée pour importer une liaison exportée par un autre module. Que le mode strict soit déclaré ou non, les modules importés s'exécutent en mode strict. L'instruction import ne peut pas être utilisée dans les scripts intégrés.

Syntaxe

import defaultExport from “module-name”;
import * as name from “module-name”;
import { export } from “module-name”;
import { export as alias } from “module-name”;
import { export1 , export2 } from “module-name”;
import { export1, export2 as alias2 , [...] } from “module-name”;
import defaultExport, { export [ , [...] ] } from “module-name”;
import defaultExport, * as name from “module-name”;
import “module-name”;

defaultExport

fera référence au nom de l'export par défaut du module.

nom-module

Le module à importer. Il s'agit généralement d'un chemin d'accès relatif ou absolu au fichier .js contenant le module et peut ne pas inclure l'extension .js. Certains outils d'empaquetage peuvent autoriser ou exiger l'utilisation de cette extension ; vérifiez votre environnement d'exécution pour autoriser uniquement les chaînes entre guillemets simples et doubles.

name

Le nom de l'objet module qui sera utilisé comme une sorte d'espace de noms lorsqu'il sera référencé.

export, exportN

Nom de l'export à importer

alias, aliasN

Précisez la référence Le nom de l'importation.

Description

Le paramètre name est le nom de "l'objet module" qui utilisera un espace de noms pour référencer l'export. Le paramètre export spécifie une seule exportation nommée, tandis que la syntaxe import * as name importe toutes les exportations.

Importez le contenu du module entier

Cela insère myModule dans la portée actuelle avec tous les modules exportés à partir du fichier situé dans /modules/my-module.js.

import * as myModule from ‘/modules/my-module.js’;

Ici, accéder à l'export signifie utiliser le nom du module (dans ce cas "myModule") comme espace de noms. Par exemple, si le module importé ci-dessus contenait un doAllTheAmazingThings(), vous pourriez l'appeler ainsi :

myModule.doAllTheAmazingThings();

Importer une seule exportation

Étant donné un objet ou une valeur nommé myExport , qui a été exporté depuis le module my-module (car le module entier est exporté) ou exporté explicitement (à l'aide de l'instruction export), insère myExport dans la portée actuelle.

import { myExport } from ‘/modules/my-module.js’;

Importer plusieurs exportations

Insérer foo et bar dans la portée actuelle.

import { foo, bar } from ‘/modules/my-module.js’;

Importer des exportations avec des alias

Les exportations peuvent être renommées lors de l'importation, par exemple en insérant shortName dans la portée actuelle.

import { reallyReallyReallyLongModuleExportName as shortName } from “/modules/my-module.js”;

Renommer plusieurs exportations lors de l'importation

Utiliser des alias pour importer plusieurs exportations d'un module.

import {
    reallyReallyReallyLongModuleMemberName as shortName,
    anotherLongModuleName as short
} form “/modules/my-module.js”;

Importer un module uniquement pour les effets secondaires

Les modules ne sont importés que pour les effets secondaires (mots neutres, pas de connotations désobligeantes), rien dans le module n'est importé, qui exécute le code global dans le module mais n'importe aucune valeur.

import “/modules/my-module.js”

Importer par défaut

Disponible lorsque l'exportation par défaut (qu'il s'agisse d'un objet, d'une fonction, d'une classe, etc.) est en vigueur. Ces valeurs par défaut peuvent ensuite être importées à l'aide d'instructions d'importation.
L'utilisation la plus simple est d'importer directement la valeur par défaut :

import myDefault from “/modules/my-module.js”;

Il est également possible d'utiliser la syntaxe par défaut avec l'utilisation ci-dessus (importation d'espace de noms et importation nommée). Dans ce cas, l'import par défaut doit être déclaré en premier.

import myDefault, * as myModule from “/modules/my-module.js”;

ou

import myDefault, { foo, bar } from “/modules/my-module.js”;

Exemple

Importé à partir d'un module d'assistance pour aider à gérer les requêtes AJAX DSON.

Module : file.js

function getJSON(url, callback){
    let xhr = new XMLHttpRequest();
    xhr.onload = function () {
        callback(this.responseText)
    };
    xhr.open(‘GET’, url, true);
    xhr.send();
}
export function getUserFulContents(url, callback){
    getJSON(url, data => callback(JSON.parse(data)));
}

Programme principal : main.js

import { getUserFulContents } from “/modules/file.js”;
getUserFulContents(‘http://www.example.com”, 
    data => { doSomethingUseful(data); } )

[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!