JavaScript moduļi

Šajā apmācībā jūs uzzināsit par JavaScript moduļiem, izmantojot piemērus.

Palielinoties mūsu programmai, tajā var būt daudzas koda rindas. Tā vietā, lai visu ievietotu vienā failā, jūs varat izmantot moduļus, lai kodus atdalītu atsevišķos failos atbilstoši to funkcionalitātei. Tas padara mūsu kodu organizētu un vieglāk uzturamu.

Modulis ir fails, kas satur kodu konkrēta uzdevuma veikšanai. Modulis var saturēt mainīgos, funkcijas, klases utt. Apskatīsim piemēru,

Pieņemsim, ka failā ar nosaukumu greet.js ir šāds kods:

 // exporting a function export function greetPerson(name) ( return `Hello $(name)`; )

Tagad, lai citā failā izmantotu greet.js kodu , varat izmantot šādu kodu:

 // importing greetPerson from greet.js file import ( greetPerson ) from './greet.js'; // using greetPerson() defined in greet.js let displayName = greetPerson('Jack'); console.log(displayName); // Hello Jack

Šeit,

  • greetPerson()Funkcija greet.js tiek eksportēti, izmantojot exportatslēgvārdu
     export function greetPerson(name) (… )
  • Pēc tam importējām greetPerson()citā failā, izmantojot importatslēgvārdu. Lai importētu funkcijas, objektus utt., Tie jāaptin ( ).
     import ( greet ) from '/.greet.js';

Piezīme . No moduļa var piekļūt tikai eksportētām funkcijām, objektiem utt. Jums ir jāizmanto exportatslēgvārds konkrētai funkcijai, objektiem utt., Lai tos importētu un izmantotu citos failos.

Eksportēt vairākus objektus

No moduļa ir iespējams eksportēt arī vairākus objektus. Piemēram,

Failā module.js

 // exporting the variable export const name = 'JavaScript Program'; // exporting the function export function sum(x, y) ( return x + y; )

Galvenajā failā

 import ( name, sum ) from './module.js'; console.log(name); let add = sum(4, 9); console.log(add); // 13

Šeit,

 import ( name, sum ) from './module.js';

Tas importē gan nosaukuma mainīgo, gan sum()funkciju no faila module.js .

Importa un eksporta pārdēvēšana

Ja importējamie objekti (mainīgie, funkcijas utt.) Jau atrodas jūsu galvenajā failā, programma, iespējams, nedarbosies tā, kā vēlaties. Šajā gadījumā programma ņem vērtību no galvenā faila, nevis importētā faila.

Lai izvairītos no konfliktu nosaukšanas, eksportēšanas vai importēšanas laikā varat pārdēvēt šīs funkcijas, objektus utt.

1. Pārsaukt modulī (eksportēt failu)

 // renaming import inside module.js export ( function1 as newName1, function2 as newName2 ); // when you want to use the module // import in the main file import ( newName1, newName2 ) from './module.js';

Lūk, eksportējot funkciju no module.js faila, jauni nosaukumi (šeit, newName1 & newName2) tiek dota funkciju. Tādējādi, importējot šo funkciju, jaunais nosaukums tiek izmantots, lai atsauktos uz šo funkciju.

2. Pārdēvējiet importēšanas failā

 // inside module.js export ( function1, function2 ); // when you want to use the module // import in the required file with different name import ( function1 as newName1, function2 as newName2 ) from './module.js';

Importējot funkciju, funkcijas nosaukumam tiek izmantoti jaunie nosaukumi (šeit newName1 un newName2). Tagad jūs izmantojat jaunos nosaukumus, lai atsauktos uz šīm funkcijām.

Noklusējuma eksportēšana

Varat arī veikt moduļa noklusējuma eksportēšanu. Piemēram,

Failā greet.js :

 // default export export default function greet(name) ( return `Hello $(name)`; ) export const age = 23;

Tad importējot varat izmantot:

 import random_name from './greet.js';

Veicot noklusējuma eksportēšanu,

  • random_name tiek importēts no greet.js. Tā kā, random_namenav greet.js, noklusējuma eksports ( greet()šajā gadījumā) tiek eksportēts kā random_name.
  • Varat tieši izmantot noklusējuma eksportēšanu, neievietojot cirtainās iekavas ().

Piezīme . Failā var būt vairāki eksportētāji. Tomēr failā var būt tikai viens noklusējuma eksportētājs.

Moduļi vienmēr izmanto stingru režīmu

Pēc noklusējuma moduļi ir stingrā režīmā. Piemēram,

 // in greet.js function greet() ( // strict by default ) export greet();

Moduļa izmantošanas priekšrocības

  • Kodu bāzi ir vieglāk uzturēt, jo dažādos failos ir atšķirīgs kods ar dažādām funkcijām.
  • Padara kodu atkārtoti lietojamu. Jūs varat definēt moduli un izmantot to vairākas reizes atbilstoši savām vajadzībām.

Importēšana / eksportēšana dažās pārlūkprogrammās var netikt atbalstīta. Lai uzzinātu vairāk, apmeklējiet JavaScript importēšanas / eksportēšanas atbalstu.

Interesanti raksti...