Mūsdienās JavaScript spēlē milzīgu lomu vietņu izstrādē. Priekšgala izstrādātāji izmanto JavaScript, lai izveidotu interaktīvas tīmekļa lietojumprogrammas. Tā rezultātā ir pieaudzis pieprasījums pēc JavaScript izstrādātājiem.
Protams, JavaScript ir attīstījies gadu gaitā. ES6 valodā ieviesa daudzas jaunas funkcijas. Viens no tiem ir veids, kā viegli koplietot kodus starp JavaScript failiem.
Funkcijas importēšana un eksportēšana JavaScript ir jaunas funkcijas, kas padarīs jūs par labāku izstrādātāju. Lūk, kā šīs funkcijas darbojas.
Kas ir JavaScript modulis?
JavaScript modulis ir JavaScript fails, kurā ir koda kolekcija, ko varat izmantot. Moduļi parasti tiek rakstīti atsevišķos failos un importēti, izmantojot imports atslēgvārds. Tas ietaupa laiku un pūles, jo vēlāk varat to izmantot atkārtoti.
Piemēram, ja jums ir funkcija, ko sauc aprēķinātSummu(), varat to iekļaut citā failā un padarīt to pieejamu jebkurā vietā savā projektā, izmantojot eksportēt un imports JavaScript darbojas bez jebkādām problēmām.
Viena no moduļu izmantošanas priekšrocībām ir tā, ka tas palīdz sakārtot kodu. Tas arī padara jūsu kodu vieglāk pārvaldāmu un vieglāk atkļūdojamu.
Lai izmantotu JavaScript failu kā moduli, HTML dokumentā ir jāizveido skripts ar a type="module".
<skripta tips ="modulis" src="fileName.js"></script>
Ir divu veidu moduļi:
- ECMAScript moduļi: standarta JavaScript moduļi, un tos atbalsta visas galvenās pārlūkprogrammas.
- CommonJS moduļi: ir vecāki, un tie netiek plaši atbalstīti.
Šeit mēs koncentrēsimies uz ECMAScript moduļiem. Ja nepieciešams, skatiet mūsu ievads JavaScript lai atjaunotu pamatus.
Kā eksportēt funkcijas JavaScript
Programmā JavaScript funkcijas ir pirmās klases objekti, kurus var nodot kā argumentus papildus lietošanai atsevišķi. Funkciju eksportēšana ir labs veids, kā tās pārsūtīt uz citām programmām. To izmanto arī, ja vēlaties izveidot atkārtoti lietojamas bibliotēkas.
Funkciju eksportēšana JavaScript tiek veikta, izmantojot eksportēt funkciju. The eksportēt funkcija eksportē doto funkciju, lai to izmantotu cits fails vai skripts. Eksportējot mūsu pašu funkcijas, mēs varam tos brīvi izmantot citos failos vai skriptos, neuztraucoties par licencēšanas problēmām.
Ir divi veidi, kā izmantot eksportēt funkcionēt efektīvi. Mēs tos aplūkosim ar kodu piemēriem.
Pieņemsim, ka jums ir fails getPersonalDetails.js kurai ir funkcija, kas pēc uzvednes ievades atgriež pilnu lietotāja vārdu. Funkcija izskatās šādi:
funkcijugetFullName(pilnais vārds){
fullName = prompt('Kāds ir tavs vārds');
konsole.log (fullName);
}
- Šo funkciju var eksportēt, vienkārši izmantojot eksportēt atslēgvārds, kam seko funkcijas nosaukums iekavās. Tas izskatās šādi:
eksportēt {getFullName}; - Otrā metode ir pievienot eksportēt atslēgvārdu tieši pirms funkcijas deklarēšanas.
eksportētfunkcijugetFullName (pilnais vārds){...}
Varat eksportēt vairākas funkcijas, izmantojot pirmo metodi. Tas tiek darīts, iekļaujot vēlamo funkciju nosaukumus cirtainajā iekavā. Funkcijas ir atdalītas ar komatu.
Piemēram: Pieņemsim, ka jums ir trīs funkcijas getPersonalDetails.js failu - getFullName(),getEmail(), getDob(). Varat eksportēt funkcijas, pievienojot šādu koda rindiņu:
eksportēt {getFullName, getEmail, getDob};
Kā importēt funkcijas JavaScript
Lai izmantotu moduli, vispirms tas ir jāimportē. Jebkuru funkciju var importēt, izmantojot pilna ceļa atsauci.
Funkciju importēšana ir diezgan vienkārša. JavaScript ir iebūvēta funkcija, lai importētu savas funkcijas no citiem failiem. Ja vēlaties piekļūt šīm funkcijām no citiem moduļiem, ieteicams katrai utilītai iekļaut funkciju deklarāciju.
Importējamā funkcija jau ir eksportēta sākotnējā failā.
Varat importēt funkcijas no cita faila, izmantojot imports atslēgvārdu funkcionalitāte. Importēt ļauj izvēlēties, kuru faila vai moduļa daļu ielādēt.
Lūk, kā jūs importējat mūsu getFullName funkcija no getPersonalDetails.js:
imports {getFullName} no './getPersonalDetails.js'Tādējādi šī funkcija būs pieejama lietošanai mūsu pašreizējā failā.
Lai importētu vairākas funkcijas, importējamās funkcijas ir iekļautas krokainajās lencēs. Katrs no tiem ir atdalīts ar komatu (,).
imports {getFullName, getEmail, getDob} no './getPersonalDetails.js'Ir vēl viens veids, kā izmantot imports funkcionalitāte. Tas ļauj mums importēt visus eksportētos datus noteiktā failā. Tas tiek darīts, izmantojot importēt * kā sintakse.
Jūs varat importēt visu mūsu eksportu getPersonalDetails.js pievienojot šādu koda rindiņu:
imports * kā personalDetailsModule no './getPersonalDetails.js'Iepriekš minētais izveidos objektu ar nosaukumu personalDetailsModule.
Šis ir tikai mainīgā nosaukums, jūs varat to nosaukt jebko.
Šis objekts satur visu mūsu eksportēto getPersonalDetails.js. Funkcijas tiek glabātas šajā objektā, un tām var piekļūt, kā jūs piekļūstat jebkura objekta īpašumam.
Piemēram, mēs varam piekļūt getFullName funkciju, pievienojot šādu koda rindiņu
personalDetailsModule.getFullName();Kas ir eksporta noklusējuma vērtība?
Eksportēt pēc noklusējuma ir ārkārtas eksporta funkcionalitāte. To izmanto, ja no faila tiek eksportēts tikai viens mainīgais. To izmanto arī, lai failam vai modulim izveidotu atkāpšanās vērtību.
Zemāk ir piemērs, kurā mēs izmantojām getFullName darbojas kā noklusējuma:
eksportētnoklusējumafunkcijugetFullName (pilnais vārds){...}Katrā modulī vai failā var būt tikai viena noklusējuma vērtība.
Funkcija, kas tiek izmantota kā noklusējuma funkcija, tiek importēta atšķirīgi. Lūk, kā importēt mūsu getFullName funkcija tiek izmantota kā noklusējuma funkcija:
imports pilnais vārds no './getPersonalDetails.js'Tālāk ir norādītas atšķirības.
- Ap importēto vērtību nav cirtainu lencēm, pilnais vārds.
- pilnais vārds šeit ir tikai mainīgā nosaukums. Tas saglabā jebkuras noklusējuma funkcijas vērtību.
Papildiniet savas JavaScript funkcijas
JavaScript moduļi ir koda daļas, kuras var atkārtoti izmantot citās koda daļās, izmantojot JavaScript importēšanas un eksportēšanas funkcijas. Tie parasti tiek rakstīti atsevišķos failos un importēti, izmantojot importēšanas atslēgvārdu. Viena no moduļu izmantošanas priekšrocībām ir tā, ka tas palīdz sakārtot kodu. Tas arī padara jūsu kodu vieglāk pārvaldāmu un vieglāk atkļūdojamu.
