Kad jūtaties ērti rakstīt pamata JavaScript programmas, ir pienācis laiks apgūt uzlabotu sintaksi, lai notīrītu kodu un paātrinātu kodēšanu.
JavaScript un TypeScript ir ļoti populāras programmēšanas valodas tīmekļa izstrādes jomā. Viņiem abiem ir plašas funkciju kopas un daudzi sintakses īsceļi, kas ievērojami uzlabo kodēšanas efektivitāti.
Uzziniet, kā uzlabot kodu un maksimāli izmantot šīs valodas, izmantojot dažus noderīgus saīsnes.
1. Trīskāršs operators
Trīskāršais operators piedāvā kodolīgu un efektīvu sintaksi nosacījumu paziņojumu izteikšanai. Tam ir trīs daļas: nosacījums, izteiksme, kas jāizpilda, ja nosacījums tiek novērtēts kā patiess, un izteiksme, kas jāizpilda, ja tā ir nepatiesa.
Šis operators ir īpaši noderīgs, pieņemot lēmumus, pamatojoties uz nosacījumiem, un attiecīgi piešķirot dažādas vērtības.
Apsveriet šādu piemēru:
konst vecums = 20;
konst vecumaTips = vecums >= 18? "pieaugušais": "Bērns";
konsole.log (ageType); // Izvade: "Pieaugušais"Šajā piemērā tiek izmantots trīskāršais operators, lai pārbaudītu, vai mainīgais
vecums ir lielāks vai vienāds ar 18. Ja tā ir, kods piešķir vērtību Pieaugušais uz mainīgo vecumaTips, pretējā gadījumā tas piešķir vērtību "Bērns".2. Veidņu burti
Veidņu literāļi piedāvā jaudīgu un efektīvu veidu, kā formatējot JavaScript virknes un tajos iekļaujot mainīgos vai izteiksmes. Atšķirībā no tradicionālās virkņu savienošanas, izmantojot vienpēdiņas vai dubultpēdiņas, veidņu literāļi izmanto atzīmes (`).
Šī unikālā sintakse sniedz vairākas priekšrocības, strādājot ar virknēm. Apsveriet šādu piemēru, kas parāda veidņu literāļu lietošanu:
konst vārds = "Alise";
konst sveiciens = `Sveiki, ${name}!`;
konsole.log (sveiciens); // Izvade: "Sveika, Alise!"Piemērā ietilpst nosaukums mainīgais veidnē burtiski izmantojot ${}. Tas ļauj viegli izveidot dinamiskas virknes.
3. Nullish Coalescing operators
Nulles apvienošanas operators (??) nodrošina ērtu veidu, kā piešķirt noklusējuma vērtības, ja mainīgais ir vai nu null vai nenoteikts. Tas atgriež labās puses operandu, ja ir kreisās puses operands null vai nenoteikts.
Apsveriet šādu piemēru:
konst lietotājvārds = null;
konst displayName = lietotājvārds?? "Viesis";
konsole.log (displeja nosaukums); // Izvade: "Viesis"Šajā piemērā, jo mainīgais lietotājvārds ir null, nullish coalescing operators piešķir noklusējuma vērtību Viesis uz mainīgo displayName.
4. Īssavienojuma novērtējums
Īsslēguma novērtēšana ļauj rakstīt kodolīgas nosacījuma izteiksmes, izmantojot loģiskos operatorus, piemēram, && un ||. Tas izmanto to, ka loģiskais operators pārtrauks izteiksmju vērtēšanu, tiklīdz var noteikt rezultātu.
Apsveriet šādu piemēru:
konst vārds = "Džons";
konst sveiciens = vārds && `Sveiki, ${name}`;
konsole.log (sveiciens); // Izvade: "Sveiks, Džon"Šajā piemērā tiks novērtēta tikai izteiksme "Sveiks, ${name}". ja mainīgais nosaukums ir patiesa vērtība. Pretējā gadījumā tas rada īssavienojumus un piešķir vērtību nosaukums sevi mainīgajam sveiciens.
5. Objekta īpašuma piešķiršanas stenogramma
Veidojot objektus, jums ir iespēja izmantot saīsinātu apzīmējumu, kas piešķir mainīgos kā rekvizītus ar tādu pašu nosaukumu.
Šis saīsinātais apzīmējums novērš nepieciešamību atkārtoti norādīt gan rekvizīta nosaukumu, gan mainīgā nosaukumu, tādējādi iegūstot tīrāku un kodolīgāku kodu.
Apsveriet šādu piemēru:
konst vārds = "Džons";
konst uzvārds = "Dirzīte";
konst persona = { vārds, uzvārds };
konsole.log (persona); // Izvade: { vārds: "Jānis", uzvārds: "Doe"}Šajā piemērā tiek piešķirti rekvizīti vārds un uzvārds izmantojot saīsinātu apzīmējumu.
6. Izvēles ķēde
Pēc izvēles ķēde (?.) ļauj piekļūt objekta ligzdotajiem rekvizītiem, neuztraucoties par starpposma nulles vai nedefinētām vērtībām. Ja rekvizīts ķēdē ir nulle vai nedefinēts, izteiksme īssavieno un atgriež nedefinētu.
Apsveriet šādu piemēru:
konst lietotājs = { nosaukums: "Alise", adrese: { pilsēta: "Ņujorka", valsts: "ASV" }};
konst valsts = lietotājs.adrese?.valsts;
konsole.log (valsts); // Izvade: "ASV"Iepriekš minētajā piemērā izvēles ķēdes operators nodrošina, ka kods nerada kļūdu, ja adrese īpašums vai valsts īpašums pazudis.
7. Objekta iznīcināšana
Objekta iznīcināšana ir spēcīgs JavaScript un TypeScript līdzeklis, kas ļauj iegūt objektu rekvizītus un piešķirt tos mainīgajiem, izmantojot kodolīgu sintaksi.
Šī pieeja vienkāršo piekļūšanu objekta rekvizītiem un manipulācijas ar tiem. Sīkāk apskatīsim, kā darbojas objektu iznīcināšana, izmantojot piemēru:
konst lietotājs = { nosaukums: "Džons", vecums: 30 };
konst {vārds, vecums} = lietotājs;
konsole.log (vārds, vecums); // Izvade: "Jānis" 30Šajā piemērā ir izvilkti mainīgie nosaukums un vecums no lietotājs objektu, iznīcinot objektu.
8. Izplatīšanas operators
Izkliedes operators (...) ļauj izvērst iterējamā elementa elementus, piemēram, masīvu vai objektu, atsevišķos elementos. Tas ir noderīgi, lai apvienotu masīvus vai izveidotu seklas to kopijas.
Apsveriet šādu piemēru:
konst cipari = [1, 2, 3];
konst newNumbers = [...skaitļi, 4, 5];
konsole.log (newNumbers); // Izvade: [1, 2, 3, 4, 5]Iepriekš minētajā piemērā izkliedes operators paplašina cipariem masīvs atsevišķos elementos, kas pēc tam tiek apvienoti ar 4 un 5 lai izveidotu jaunu masīvu, jauni numuri.
9. Objekta cilpas saīsinājums
Atkārtojot objektus, varat izmantot par...in cilpa kombinācijā ar objektu iznīcināšanu, lai ērti atkārtotu objekta īpašības.
Apsveriet šo piemēru:
konst lietotājs = { nosaukums: "Džons", vecums: 30 };priekš (konst [atslēga, vērtība] noObjekts.entries (lietotājs)) {
konsole.log(`${key}: ${value}`);
}
// Izvade:
// vārds: Jānis
// vecums: 30
Iepriekš minētajā piemērā Object.entries (lietotājs) atgriež atslēgu-vērtību pāru masīvu, ko katra iterācija pēc tam iznīcina mainīgajos taustiņu un vērtību.
10. Array.indexOf Shorthand, izmantojot bitu operatoru
Varat aizstāt zvanus uz Array.indexOf metode ar saīsinājumu, izmantojot bitu operatoru ~ lai pārbaudītu, vai elements eksistē masīvā. Saīsinājums atgriež elementa indeksu, ja tas ir atrasts vai -1 ja nav atrasts.
Apsveriet šādu piemēru:
konst cipari = [1, 2, 3];
konst indekss = ~numbers.indexOf(2);
konsole.log (indekss); // Izvade: -2Iepriekš minētajā piemērā ~numbers.indexOf (2) atgriežas -2 jo 2 atrodas indeksā 1, un bitu operators noliedz indeksu.
11. Vērtību apraide uz Būla ar!!
Uz nepārprotami konvertēt vērtību Būla vērtībai varat izmantot dubultās noliegšanas operatoru (!!). Tas efektīvi pārvērš patieso vērtību par taisnība un nepatiesa vērtība viltus.
Apsveriet šādu piemēru:
konst vērtība1 = "Sveiki";
konst vērtība2 = "";
konsole.log(!!vērtība1); // Rezultāts: patiess
konsole.log(!!value2); // Izvade: falseIepriekš minētajā piemērā !!vērtība1 atgriežas taisnība jo stīga Sveiki ir patiess, kamēr !!vērtība2 atgriežas viltus jo tukšā virkne ir nepatiesa.
Koda atbloķēšanas efektivitāte un lasāmība
Izmantojot šos JavaScript un TypeScript saīsinājumus, varat uzlabot kodēšanas efektivitāti un izveidot kodolīgāku un lasāmāku kodu. Neatkarīgi no tā, vai tiek izmantots trīskāršais operators, īssavienojumu novērtējums vai veidņu literāļu jaudas izmantošana, šie saīsinājumi nodrošina vērtīgus rīkus efektīvai kodēšanai.
Turklāt objekta rekvizītu piešķiršanas saīsinājums, izvēles ķēdes veidošana un objektu iznīcināšana vienkāršo darbu ar objektiem, savukārt izkliedes operators un masīvu saīsinājumi nodrošina efektīvu masīvu manipulācijas. Apgūstot šos saīsinājumus, jūs kļūsit par produktīvāku un efektīvāku JavaScript un TypeScript izstrādātāju.