Come utilizzare l'importazione ed esportazione in JavaScript

Come utilizzare l'importazione ed esportazione in JavaScript

JavaScript offre una funzione avanzata denominata moduli, Usando questi moduli Possiamo utilizzare qualsiasi oggetto, classe, letterale o funzione di un file JavaScript in qualsiasi altro file JavaScript. Migliora la riusabilità del codice e riduce il tempo di caricamento del file HTML. A tale scopo, i moduli JavaScript forniscono due parole chiave, "importare" E "esportare".

Implementazione dell'esportazione in JavaScript

Una parola chiave "esportare" è richiesto ogni volta che esportiamo i dati di un file in un altro file. Usando la parola chiave "esportare" Possiamo esportare qualcosa come una variabile, una funzione o una classe in qualsiasi altro file. Quello che dobbiamo fare è semplicemente scrivere il "esportare" Parola chiave prima di quella variabile, funzione, classe o qualsiasi cosa vogliamo esportare.

La sintassi per esportare una variabile, funzione e classe è:

// esportando una variabile
esportare var emp_name;
// esportando una funzione
funzione di esportazione emp ()

// esportazione di una classe
dipendente di classe di esportazione

Ora troveremo il funzionamento della parola chiave "esportazione" con l'aiuto del seguente esempio, supponiamo che creiamo il file con il nome esportazione.JS:

Considera il seguente esempio che determina come esportare una variabile, una funzione o una classe:

esportazione let emp_name = "Mike Smith";
funzione di esportazione emp ()
console.log ("Il nome del dipendente è Mike Smith");

dipendente di classe di esportazione
costruttore (emp_name)

console.log ("benvenuto" + emp_name);

La sintassi alternativa per l'esportazione degli elementi del file è:

Esporta emp_name, emp, dipendente;

Utilizzando la sintassi sopra data possiamo esportare tutti gli elementi del file in una singola istruzione e, durante l'importazione, utilizzeremo lo stesso nome per la variabile, la funzione e la classe. Per esempio:

var emp_name = "Mike Smith";
funzione emp ()
console.log ("Il nome del dipendente è Mike Smith");

dipendente di classe
costruttore (emp_name)

console.log ("benvenuto" + emp_name);


esporta emp_name, emp, dipendente;

Un altro modo di esportare è l'esportazione predefinita, è molto utile per esportare un singolo elemento:

var emp_name = "Mike Smith";
esporta Default EMP_NAME;

Questo aiuta a importare la variabile in qualsiasi altra classe con qualsiasi altro nome.

Implementazione dell'importazione in JavaScript

In JavaScript, la parola chiave "importare" viene utilizzato ogni volta che importa qualcosa da un file. Dobbiamo scrivere il "importare" parola chiave prima di qualsiasi cosa vogliamo importare da qualche altro file.

La sintassi a importare Una variabile, funzione e classe è:

// Importa una variabile
import emp_name da './nome del file'
// Importazione di una funzione
Import emp da './nome del file'
// Importa una classe
import dipendente da './nome del file'

Abbiamo creato un altro file con il nome "Importa.JS "e ho importato tutti i dati dal file" Esporta.js ":

import emp_name da "./esportare.js "
console.log (emp_name);
import emp da "./esportare.js "
Emp ();
import dipendente da "./esportare.js "
let a = new dipendente ("John");

Una variabile, una funzione e una classe vengono importate dal file "./esportare":

L'output verificherà che ogni elemento presente nel "./esportare.Il file JS "viene importato in" Importa.file js ":

emp_name è variabile, Emp è una funzione, e Dipendente è una classe creata in esportare.js file:

import emp_name, emp, dipendente da "./esportare.js ";
console.log (emp_name);
Emp ();
let a = new dipendente ("John");

Ora qui, nel codice sopra, importa tutti gli elementi in una singola affermazione:

Otterremo il seguente output:

Ora considereremo un altro esempio per capire come importare un elemento predefinito:

importare _name da "./esportare.js "
console.log (_name);

Importiamo un membro predefinito dal file "Esporta.JS "con" _name ":

Nel "esportare.JS " File La variabile viene creata con il nome "Emp_name":

Ma accessiamo alla stessa variabile con "_nome" nel "importare.JS " File e ottenere il seguente output:

Otteniamo lo stesso output, questo significa importare qualsiasi predefinito elemento non è necessario utilizzare lo stesso nome del primo file, invece, possiamo anche usare nomi diversi.

Conclusione

Importazione ed esportazione sono nuove funzionalità introdotte nei moduli di JavaScript per migliorare la riusabilità del codice. JavaScript fornisce parole chiave di importazione ed esporta per utilizzare il codice di un file in altri file. In questo articolo, determiniamo come lavorare con le funzionalità di importazione ed esportazione del modulo. Per comprendere meglio il concetto consideriamo alcuni esempi e implementali in JavaScript.

Dopo aver studiato a fondo questo articolo, qualcuno può analizzarlo durante l'uso importare E esportare Caratteristiche del modulo Dobbiamo utilizzare lo stesso nome per la variabile, la funzione e la classe in entrambi i file (il file da cui si esportano i dati e il file in cui si stanno importando i dati). Mentre "predefinito" è un caso eccezionale in cui non vi è tale requisito, è possibile utilizzare qualsiasi nome a tua scelta durante l'importazione.