Videoõpetus: õpi Javascripti ja jQueryt

Olete teretulnud lõpliku JavaScripti ja jQuery kursusele.

Selles videos selgitatakse, mis on JavaScript ja mida see meile pakub.

Selles videos õpid, millist toimetajat me kasutame, ja paigaldame selle koos.

Selles videos näidatakse, kuidas kasutada klikke JavaScriptiga ja kuidas muutujad töötavad.

Kui-lausend. Kui-statementi (eesti keeles: kui) kasutatakse programmeerimisel väga sageli. Näiteks juhul, kui soovitakse midagi teha ainult siis, kui teatud tingimus on täidetud.

Selles videos on juttu massiividest (väljadest) JavaScriptis. Need võimaldavad meil salvestada mitmeid infokilde ühe muutuja sees.

Selles videos saate õppida for-tsükleid (tsükleid). Need võimaldavad meil sama koodi mitu korda järjest käivitada.

Funktsioonid on omamoodi miniprogramm, mida saame luua ja alati uuesti kasutada. Kui näiteks vajutad oma telefonis kodunuppu, kutsutakse esile funktsioon, mis viib sind tagasi oma avalehele. Funktsioonid teevad tööd oluliselt lihtsamaks.

Siin näidatakse väljakutse tulemust (nimelt kviisi) ja lisaks luuakse HTML-i alus.

Siin programmeeritakse küsimustiku välimus (CSS).

Siin programmeeritakse ja selgitatakse meie viktoriini JavaScript-i.

Sa oled juba näinud, kuidas funktsioonid ühe parameetriga toimivad. Nüüd vaatame funktsioone mitme parameetriga. Mitu parameetrit on vajalikud siis, kui soovite funktsiooni kasutada mitme erineva muutujaga. Matemaatikas näiteks kui lisatakse mitu väärtust.

On olemas globaalsed ja kohalikud muutujad. Lühidalt öeldes: globaalsed muutujad on muutujad, mida luuakse funktsioonide väljaspool, ja kohalikud muutujad on need, mida luuakse funktsioonide sees. Siin vaatleme põhjalikumalt, kuidas see toimib.

Programmeerimiskeeltes on võimalik funktsioone seadistada nii, et neil oleks tagastusväärtus. Seni oleme kasutanud ainult funktsioone, mis tegid lihtsalt midagi, kuid ei tagastanud midagi, millega saaksime edasi töötada. Seetõttu vaatame nüüd TAGASI.

Selles artiklis käsitleme matemaatilisi operaatoreid ja omistusoperaatoreid. Matemaatilised operaatorid on üsna lihtsad asjad nagu liitmine, lahutamine jne, omistusoperaatoritega on võimalik teha suhteliselt kergeid lihtsaid operatsioone, näiteks suurendamine 5 võrra. Kuna mõlemad on programmeerimise jaoks olulised, siis käsitleme siin mõlemat teemat.

On olemas kolm (või neli) erinevat tüüpi tsüklit programmeerimisel: Do-while-tsükkel, While-tsükkel ja For-tsükkel. For-tsükkel oleme juba tutvunud. Nüüd keskendume Do-while-tsüklile (jalgadega juhitud) ja While-tsüklile (peaga juhitud).

Selles artiklis on juttu alternatiivist If-tingimustele. Selleks on Switch (vahetaja) ja Case (juhtum). Sul on praktiliselt lüliti, mis vahetab erinevate juhtumite vahel ja jääb aktiivseks juhtumiks.

Oleme juba käsitledes massiive, kuid pole veel üksikasjadesse läinud. On veel palju asju, mida massiivide kohta teada. JavaScripti massiivi olulisim omadus on elementide arv (length). Massiivil on aga veel teisigi omadusi nagu näiteks indeks, mis annab meile informatsiooni massiivi positsiooni 0 kohta.

Objektid on äärmiselt oluline ja huvitav kontseptsioon paljudes programmeerimiskeeltes. Põhimõtteliselt võib kõike kirjeldada objektina. Võtame näiteks objekti, mida näeme kõige sagedamini teedel: AUTO. Auto omab teatud omadusi/omadussõnu ja võib sooritada teatud tegevusi.

Vaadakem, kuidas saame JavaScriptis objekte luua. Selleks loome konstruktorifunktsiooni ning kaks eksemplari oma objektist meie head-sildis. Konstruktorifunktsiooni sees, mis kannab sama nime kui meie objekt, ütleme programmile, et parameetrid, mis antakse konstruktorifunktsioonile objekti eksemplari loomisel, peaksid olema objekti väärtused.

Objektide funktsioonide aluseks alustame viimase õpetuse koodiga, kus oleme loonud muutujad, mis luuakse meie objekti igas eksemplaris.

Selles õpetuses õpid tundma Math objekti. See on objekt, mis põhineb Math klassil ja pakub mitmeid lahedaid omadusi ja funktsioone.

Selles videos on juttu Date-objektist ehk Date-klassist. Need on objektid, mida saab kasutada programmides aja lisamiseks. Siinkohal ei pea silmas pidama tingimata kellaega ega kuupäeva, vaid võib olla ka ajavahemik. Date-objekt sisaldab aega, mis on möödunud ajast 1970-01-01 00:00:00. On erinevaid viise, kuidas Date-konstruktorile parameetreid edastada.

Selles videos õpid, kuidas ehitada interaktiivset kella JavaScript abil.

Selles videos on juttu pärimisest ja polümorfismist. Kaks objektorienteeritud programmeerimise kontseptsiooni.

Selles artiklis käsitleme küsimust: mis on jQuery? jQuery on JavaScripti raamatukogu, mis võimaldab meil luua veel lahedamaid veebilehti.

Siin õpid, kuidas jQuery abil saab klikke palju lihtsamini töödelda.

Selles õpetuses saate teada, kuidas jQuery abil veebilehe välimust muuta. Selleks võime näiteks lihtsalt ühe välja atribuuti üle kirjutada. Selles näites saame muuta iFrame'i lingi (src/source), kui kursoriga selle kohal hoitakse. Koodi saaks probleemideta muuta ja näiteks ruutu suurendada, kui hiirega peale liigutatakse, katta ja kõrgusatribuut üle kirjutades. Üldiselt saab nüüd seda meetodit kasutada veebilehe välimuse muutmiseks ilma suurema vaevata.

Üks jQuery lahedatest omadustest on võimalus tuhmistada üks element. Selles näites tuhmistame ühe nupu, kui klikime teisele nupule. Selleks kasutame FadeOut-funktsiooni ("Tuhmistamise funktsioon"). Elementi uuesti nähtavale tuua kasutame FadeIn-funktsiooni.

Selles videos tegeleme animatsiooniga jQuery-s. See on midagi, mis liigub. Niisiis tagame, et mingi element meie veebilehel liigub/muutub. Selle jaoks jQuery-s on funktsioon nimega animate(), mis ootab kolme parameetrit.

Vaadakem, mis on jQuery UI.

Akkordion on vidin, mis võimaldab meil näha ainult teatud osi tervikust, nagu akordionil. See on eriti kasulik, kui soovite edastada palju teavet, mis oleks aga ühe suure tekstina liiga segane.

Selles õpetuses on juttu sortable'itest jQuery UI-s. Need on sorteeritavad elemendid. Sa tead neid, kui kasutad tootlikkuse veebilehti nagu Wunderlist või Trello. Võimalus muuta elemendid sorteeritavaks on äärmiselt äge funktsioon, mida saad kasutada mitmesugustes rakendustes.

Mõnikord juhtub, et kasutaja soovib elemendi suurust muuta. Sel juhul on täpselt sobivad redigeeritavad elemendid. Need võimaldavad just seda. Elemendi all paremal näete väikest kolmnurka, mida saate klõpsata ja seejärel hiireklahvi all hoides seda suurendada või vähendada.

jQuery UI abil saab väga lihtsalt luua lohistatava elemendi, mida saab edasi-tagasi lohistada. Kuidas seda tehakse, vaatame siin.

Progressiribad või edenemisribad on suurepärane vahend, et näidata kasutajale, kui kaugele ta hetkel mingis kindlas protsessis jõudnud on. Näiteks müügiprotsessis veebipoes või küsitluse korral aitab see kasutajal teada, kui kaugel ta on sammude läbiviimisega.

Selles õpetuses soovin lühidalt rääkida jQuery UI efektidest. Tegelikult on olemas päris lahedad efektid, mis võimaldavad muuta sinu veebilehe väljanägemist veelgi paremaks ja lisaks panna su kasutajad täiesti hämmingusse.

Selles videos näete väljakutse tulemust. KKK leht.

Siin me viime sisse sageli küsitud küsimuste lehe.

Selles videos tutvustatakse ajumängu, mis selle peatüki raames programmeeritakse.

Esmalt tegeleme mängu struktuuri ja väljanägemisega.

Nüüd tegeleme mõnede mängu funktsioonidega.

Mängija saab juba teha esimesi tegevusi mängus, nüüd aga tegeleme sellega, et mäng saaks õigesti uuesti käivitatud ja lõpetatud.

Nüüd on ainult vaja lisada taimer mängu, et hinnangut õigesti arvutada ja piirata mängu ajaliselt. Lisaks teeme veel mõned väiksemad sammud, et mäng lõpuni viia.

Siin tutvustatakse peatüki rakendust. See on tegelikult to-do-nimekirja rakendus/veebileht.

Nüüd loome aluse ja vaatame, kuidas saame jQuery Mobile'iga vastava teema luua ja muuta.

Kuna järgime OOP lähenemist, peame looma vastava arhitektuuri. Selle eest hoolitseme siin.

Selles videos lisame lehekülgi ja tegeleme leheküljega, kus loome ülesandeid.

Sarnaselt investeerimislehele tuleb täita ka muutmisleht ja anda vastav funktsionaalsus.

Nüüd saame veel kord arhitektuuri käsile võtta ja luua andmestruktuuri.

Kuna meil on nüüd oma andmestruktuur, saame seda üsna lihtsalt meie kasutajaliideses vastavalt kutsuda.

Programmeerimisel olid „selgitusvoo“ jaoks vajalikud mõned sammud, mida saame nüüd parandada. Lisaks hoolitseme andmete jätkuva salvestamise eest ja täiendame rakendust.