Uzlabojiet savas JavaScript prasmes, izmantojot šos 9 jautros spēļu projektu apmācības videoklipus

Fakts, ka 98,4% no visām vietnēm izmanto JavaScript, ir iemesls, kāpēc jums tas būtu jāzina kā izstrādātājam. Retrospektīvi, spēles izveide ar JavaScript ne tikai palīdz ātri mācīties. Tas arī ļauj jums apgūt vienkāršos un sarežģītos jēdzienus dažādās darba situācijās — neatkarīgi no tā, vai esat iesācējs vai atsvaidzināšanas speciālists.

Ja mācāties labāk, izmantojot vizuālas demonstrācijas, šīs uz JavaScript balstītās spēļu apmācības pakalpojumā YouTube ir jūsu laika vērtas.

1. Kāršu spēle ar JavaScript

Šī JavaScript kāršu spēle ar Gevinu Lonu parāda kartīšu pārvēršanu ar vairāk nekā 600 JavaScript koda rindiņām. Lai gan galvenā uzmanība tiek pievērsta JavaScript mācīšanai, jūs arī iemācīsities apvienot CSS projektēšanas jaudu ar HTML DOM strukturēšanu, lai panāktu atsaucību ar JavaScript.

Projekta gala mērķis ir uzsist pāris kārtis, un spēlētājs uzmin dūzi, kad kārtis beidzot maina vietas. Katra kārts ir četru dažādu kāršu lomu attēls. Tātad, lai gan jūs pats neveidosit kārtis, jūs iemācīsities reaģēt ar to pozīcijām, palielināt spēļu kārtas, pievienot vai noņemt punktu skaitu, mainoties līmeņiem, un saglabāt spēļu rezultātus

pārlūkprogrammas lokālā krātuve— visi izmanto JavaScript.

Apmācība ir pakāpeniska un viegli izpildāma, neskatoties uz smago celšanu, ko darīsit aiz ainas. Tas ir lieliski piemērots iesācējiem un atsvaidzinātājiem. Lai gan runa ir par kāršu spēles izveidi, tā sniedz jums lielāko daļu JavaScript elektroinstalācijas metožu reālās dzīves situācijās. Turklāt tas atšķetina jūsu domāšanas spēju.

2. 2D Breakout spēle ar JavaScript

​​​

Ja vēlaties iemācīties kontrolēt darbību intervālus un dinamiski pārvietot DOM elementus, izmantojot JavaScript, Ania Kubów parāda, cik jautri tas ir ar šo izlaušanās spēles pamācību, izmantojot JavaScript. Kā pluss ir tas, ka video arī parāda, kā uzņemt un demonstrēt savu projektu potenciālajiem darba devējiem.

Padomājiet par katru iespēju izlaušanās spēlē; kustīga platforma ar bumbiņu, kas tangenciāli atsitas pret sienām, lai šķeltu virs tās esošos ķieģeļus. Atlīdzības sistēma tiks kodēta arī šajā sistēmā. Kopumā šo izlaušanās spēles pamācību ir vērts apsvērt, ja vēlaties kaut ko izveidot no paša sākuma, neizmantojot trešo pušu aģentus vai iegūtos attēlus.

Savienojot loģiku funkcijās, videoklipā vienkāršās darbībās ir sniegta informācija par JavaScript klases un objektu jēdzieniem, tostarp nosacījuma paziņojumu paraugprakse tāpat kā slēdža korpuss.

3. JavaScript Snake spēle

Atklājiet savu Nokia 3310 Snake II spēles nostalģiju, izveidojot šo JavaScript čūskas spēli kopā ar Kailu. Jūs, iespējams, esat to spēlējis iepriekš un, iespējams, spēlēsiet vēl daudzas reizes dzīves laikā, jo jūs to iekodēsit, izmantojot vaniļas JavaScript.

Mācot jums dinamiski savienot DOM, šajā videoklipā ir parādīts, kā izveidot un izmantot pielāgotus moduļus JavaScript. Tādējādi tas paver jums iespēju uzzināt par problēmu nošķiršanu, izmantojot principu “Neatkārtojies” (DRY).

Aizkulisēs jūs apgūsit uzlabotas JavaScript koncepcijas. Uzdevumi, tostarp spēlētāju režģa izveidošana, ēdiena izvietošana, čūskas ķermeņa veidošana, čūskas pagarināšana, čūskas kodēšana navigācijas loģika, izveidojot atlīdzības un sodu shēmu un kontrolējot čūskas ātrumu, atklās jūs JavaScript.

4. Tic Tac Toe spēle ar JavaScript

​​​​​

Iespējams, jūsu Tic Tac Toe spēle kļūst asāka, veidojot to ar JavaScript citā videoklipā ar Kailu. Tas ir vienkāršs, bet vērtīgs projekts JavaScript iesācējiem čakarēt, risinot sarežģītas problēmas.

Video nebeidzas tikai ar JavaScript. Tas arī parāda, kā izmantot lietotāja interfeisa dizainu, izmantojot CSS. Ar konsekvenci un apņēmību šajā videoklipā varat apgūt gandrīz visas metodes, kas nepieciešamas, lai sāktu tīmekļa izstrādes ceļu.

Manipulējot ar DOM, izmantojot JavaScript, videoklips apņem smagnējo lēmumu kodēšanu, lai uzvarētu un neizšķirtu, izlemtu spēlētāju gājienus un objektu izlīdzināšanu. JavaScript funkcijas, cilpas un nosacījumi ir daži no uzlabotajiem jēdzieniem, ko uzzināsit šajā JavaScript Tic tac Toe mācību video.

5. Slaidu mīklu spēle ar JavaScript

Puzles var būt pārdomātas. Taču tādas izveide, izmantojot vaniļas JavaScript, izklausās kā jautrs veids, kā izpētīt savu radošumu un apgūt pamata un sarežģītās JavaScript koncepcijas.

Ja vēlaties uzzināt, kā izmantot JavaScript jēdzienus, tostarp nosacījumu slēdžus un dinamiskas DOM pozīcijas manipulācijas, izmantojot pielāgotas un iebūvētas funkcijas, vēlaties kodēt šajā apmācībā.

Lai gan skolotājs ievieto JavaScript skripta tagā HTML failā, skaidrības labad varat pārvērst savu skriptu īpašā JavaScript failā un saistīt to ar DOM savā gadījumā. Neatkarīgi no tā, lai sasniegtu savu mērķi, vislabāk ir koncentrēties uz galveno loģiku un domāšanas procesu, tostarp uz to, kā izmantot šeit apgūto vairāk reālās dzīves scenārijos.

6. Automašīnu sacīkšu spēle ar JavaScript

Automašīnu sacīkšu spēles izveide, izmantojot vaniļas JavaScript, iespējams, nesniegs vislabāko grafisko rezultātu. Taču, pievienojot vadus strādājošai automašīnu sacīkšu spēlei, izpildot šo pamācību, jūs iemācīsit izmantot JavaScript funkcionalitāti uzlabojošo jaudu jebkurā lietojumprogrammā.

Šī apmācība ietver divu automašīnu (sarkanās un zilās) novietošanu sacīkšu trasē. Zilā automašīna parādās nejauši no jebkura virziena, un sarkanais transportlīdzeklis, kas pārstāv spēlētāju, mēģina izvairīties no sadursmes. Spēle beidzas, kad starp abām automašīnām ir kontakts.

Lai gan tas ir vienkāršs apraksts par to, ko veidosit šajā, jūs uzzināsit dažas JavaScript uzlabotas loģikas DOM manipulācijām un stilam. Jūs arī iegūsit ieskatu par JavaScript operatoriem, vienlaikus veidojot spēlētāju balvas un sodus.

Pievienojot celiņam funkcionalitāti, daži jēdzieni, ko jūs apgūsit, ietver JavaScript notikumus, nosacījumus, anonīmas funkcijas, JavaScript animāciju, intervāla kontroli un daudz ko citu.

7. Mario spēle ar JavaScript

Šī JavaScript Mario spēles pamācība ir viss, kas jums nepieciešams, lai iegremdētu JavaScript sīkumainību. Lai gan Mario spēles izveide ar JavaScript izklausās sarežģīti, jūsu pasniedzējs Kriss šajā YouTube videoklipā parāda, ka tas ir vairāk nekā iespējams. Tāpēc, iespējams, vēlēsities izklaidēties un izpētīt savas kritiskās domāšanas spējas, veidojot līdzi.

Lai gan iesācējiem šī apmācība varētu šķist nedaudz uzlabota, tas ir lielisks mēģinājums atsvaidzinātājiem pacelt savas JavaScript prasmes uz nākamo līmeni.

Papildus mācībām par elementu manipulācijām, jūs izmantosit tīra JavaScript jaudu, lai izveidotu adaptīvu audekla paraugplāksni spēles saskarnei, izmantojot objektorientētā programmēšana (OOP). Tā kā atskaņotājs ir aktīvi kustīgs, tiek izmantota JavaScript tastatūras vadība, notikumu apstrāde, cilpas, operatori, nosacījumi un iebūvētās un pielāgotās funkcijas ir viena no starpprojektu iespējām iegūt.

8. Izveidojiet mīnu meklētāju, izmantojot JavaScript

Vēlaties izpētīt rekursīvo funkciju spēku un masīva metodes reizinot DOM elementus ar JavaScript? Iespējams, vēlēsities sākt ar šo Ania Kubów JavaScript Minesweeper pamācību vietnē Traversy Media.

Tas ietver lielu uzmanību detaļām. Taču tā ir iesācējiem draudzīga apmācība un viena no labākajām režģa izkārtojuma sistēmām, izmantojot JavaScript. Galīgais mērķis ir izveidot režģa veidni, kurā spēlētāji izvairītos no uzkāpšanas uz mīnas.

Lai cik vienkārši tas izklausītos, jūs uzrakstīsit daudz programmēšanas loģikas, kas ietver lielāko daļu JavaScript galveno paņēmienu, lai nodrošinātu spēles funkcionalitāti aizkulisēs.

9. Pokemon JavaScript spēles apmācība ar HTML audeklu

Pokemon ir viens no sarežģītākajiem spēļu projektiem, ko varat izveidot, izmantojot JavaScript. Tomēr, ja jums ir nepieciešamas ilgas, stingras kodēšanas stundas ar JavaScript un esat gatavs iznākt ar lielāku pārliecību, labāk piesakieties šai apmācībai.

Papildus DOM skriptiem un animācijai ar JavaScript, videoklipā ir parādīts, kā pārvietot un renderēt līdzekļus, tostarp audio un attēlus, izmantojot JavaScript. Pamācībā ir daudz informācijas par JavaScript, kas jums šķitīs vērtīgs jebkurās reālās dzīves kodēšanas problēmās.

Papildus citām galvenajām JavaScript manipulācijas metodēm apmācībā plaši tiek izmantoti arī OOP jēdzieni; tas ir vērtīgi, ja plānojat vēlāk iedziļināties TypeScript. Viens no šīs apmācības vienkāršošanas faktoriem ir tas, kā pasniedzējs izklāsta uzdevumus.

Ir viegli atkāpties, ja iedomājaties sarežģīto sistēmu, ko izveidosit, lai tas darbotos. Bet padomājiet par to, ko jūs galu galā iegūsit.

Uzziniet JavaScript problēmu risināšanas lietojumprogrammas

Spēlēs programmēšanā tiek izmantota visatsaucīgākā un intuitīvākā loģika. Tāpēc ir vērts apgūt JavaScript no tā izveides. Lai gan šīs apmācības ir balstītas uz spēlēm, tās atklāj JavaScript pamatjēdzienus, kas piemērojami daudzām citām kodēšanas problēmām, tostarp tīmekļa izstrādei un mobilo lietotņu izveidei. Pat ja plānojat vēlāk pievērsties ietvariem, jūs lietosit šos jēdzienus neatkarīgi no tā.