JavaScript pagrindai. 2 dalis JavaScript kursas nuo pradedančiųjų iki pažengusiųjų

Tai yra antroji JavaScript tinklaraščio įrašų serijos dalis, kuri nuves jus nuo pradedančiojo iki pažengusiojo. Šios serijos pabaigoje jūs žinosite visus pagrindus, kuriuos reikia žinoti, kad pradėtumėte programuoti JavaScript. Be jokių papildomų kalbų, pradėkime antrąjį mokymąsi.

JavaScript pagrindai – turinys:

1. JavaScript pagrindai
2. Viena eilutė po kitos vykdymas
3. Du būdai užbaigti instrukcijas
4. Komentarai

Šiame tinklaraščio įraše mes tęsiame ten, kur baigėme pirmame tinklaraščio įraše. Šiuo etapu turėtumėte turėti atidarytą Google Chrome naršyklę ir konkrečiai atidarytą JavaScript konsolę. Jei dėl kokių nors priežasčių jas uždarėte, dabar būtų geras laikas jas vėl atidaryti. Pradėkime mokytis JavaScript pagrindų.

Jei esate „Mac“ kompiuteryje, klaviatūros kombinacija konsolės atidarymui yra „option + command + J“, kai atidarote Chrome. Jei naudojate „Windows“ įrenginį, galite naudoti klaviatūros kombinaciją „Control + Shift + J“, kad atidarytumėte JavaScript konsolę, kai atidarote Chrome. Taip pat galite eiti į meniu viršuje ir pasirinkti Peržiūra -> Kūrėjas -> JavaScript konsolė.

JavaScript pagrindai

JavaScript, kaip ir visos kitos programavimo kalbos, yra kalba, kurią naudojate bendraudami su kompiuteriais. Kaip natūrali kalba turi gramatiką ir žinomus žodžius, kad sudarytų tinkamas sakinius, programavimo kalbos taip pat turi tam tikras taisykles, kurių turėtumėte laikytis, kad efektyviai bendrautumėte su kompiuteriu.

Pavyzdžiui, tam tikri žodžiai JavaScript variklyje, kuris vykdo mūsų kodą, turi tam tikrą prasmę, pavyzdžiui, „alert“ raktinis žodis, kurį naudojome ankstesniame mokyme, turėjo prasmę parodyti įspėjimą vartotojui su konkrečiais žodžiais, kuriuos jie įrašė į skliaustus iškart po to. Mūsų atveju mes parašėme „Hello, World!“, todėl gavome įspėjimą, kuris sakė „Hello, World!“.

Taip pat yra kitų rezervuotų raktinių žodžių JavaScript, apie kuriuos turėtume žinoti, kad galėtume efektyviai bendrauti su kompiuteriu, naudodami tinkamus žodžius ir gramatiką. Taip pat, kaip ir natūralioje kalboje, programavimo kalbose taip pat yra gramatika. Ta gramatika dažnai vadinama „sintakse“ programavimo kalbose, o JavaScript nėra išimtis. Todėl gerai suprasti pagrindinius raktinius žodžius ir gramatiką, kurią turime JavaScript, kai pradedame mokytis apie JavaScript pagrindus. Pažvelkime į keletą pagrindinių dalykų, kuriuos turėtume žinoti apie JavaScript.

Viena eilutė po kitos vykdymas

Kalbant apie JavaScript pagrindus, viena iš pirmųjų dalykų, kuriuos turėtumėte žinoti, yra tai, kad kodas, kurį rašote, bus vykdomas eilutė po eilutės, iš viršaus į apačią. Šis kodo vykdymo stilius taip pat vadinamas JavaScript „interpretuojama programavimo kalba“.

Priešingai, kai kurios programavimo kalbos yra „kompiliuojamos programavimo kalbos“. Kai kurie kompiliuojamų kalbų pavyzdžiai būtų: C, C++, C#, Swift, Java ir kt. Pagrindinis skirtumas yra tas, kad su kompiliuojamomis programavimo kalbomis visas jūsų rašomas kodas bus „kompiliuojamas“ ir bus vykdomas vienu metu kompiuterio. Todėl gali būti sunkiau pradėti mokytis kompiliuojamos programavimo kalbos, nes gali būti sunkiau pastebėti, kur padarėte klaidą savo programoje.

Interpretavimo programavimo kalbų pavyzdžiai būtų JavaScript, Python, Bash ir Matlab. Naudodami interpretuojamas programavimo kalbas turite pranašumą matyti, kurioje eilutėje padarėte klaidą, pavyzdžiui, pamiršdami kabliataškį arba nesutapdami skliaustų savo kode. Turint šią savybę, gali būti ne taip svarbu tam tikrose programose, tačiau kai bandome įkelti svetainę su lėtu interneto ryšiu, pageidautina, kad kiekviena JavaScript eilutė būtų vykdoma kuo greičiau.

Du būdai užbaigti instrukcijas

Kompiuterinė programa galiausiai yra instrukcijų rinkinys kompiuteriui. Bet kur baigiasi viena programa ir kur prasideda kita instrukcija? Yra skirtingi požiūriai į šią problemą. JavaScript naudoja dvi pagrindines priemones: kabliataškį ir skliaustus.

Priklausomai nuo to, kokio tipo instrukciją rašome, mes paprastai naudosime vieną iš jų, kad užbaigtume arba supakuotume instrukcijų rinkinį. Mes naudosime skirtingus skliaustus skirtingoms funkcijoms ir duomenų tipams. Pavyzdžiui, „alert(„Hello, World“);“ kode, kurį anksčiau vykdėme, skliaustai, kurie supa „hello world“ tekstą, sako kompiuteriui, ką turėtų pasakyti įspėjimas, o kabliataškis instrukcijos pabaigoje sako kompiuteriui, kad ši instrukcija baigiasi čia, galite pereiti prie kitos instrukcijos. Tai labai panašu į tai, kaip mes naudojame tašką „.“ sakinių pabaigai anglų kalboje.

Komentarai

Komentarų pridėjimas prie kodo yra esminė programavimo dalis. Gali būti lengva suprasti, ką rašote, kai rašote, tačiau priklausomai nuo kodo sudėtingumo, po šešių mėnesių galite turėti labai mažai idėjų, kai grįšite prie kodo.

Komentarų pridėjimas ne tik palengvina jūsų kodo supratimą ateityje, bet ir palengvina bet kam, su kuo dirbate, suprasti kodą. Tai taip pat gali padėti geriau suprasti problemą, su kuria dirbate, nes paprastai daug lengviau spręsti problemas, jas padalijant į mažesnes dalis. Komentuojamos jūsų kodo dalys bus ignoruojamos interpretuotojo ir nebus vykdomos.

Yra du būdai, kaip galite pridėti komentarus JavaScript. Pirmasis yra pridėti paprastą „vienos eilutės“ komentarą su dviem brūkšneliais, kaip šis:

// tai yra komentaras

Šiuo būdu viskas, ką rašote po dviem brūkšneliais, bus ignoruojama konkrečioje eilutėje, kurioje įdėjote brūkšnelius. Galite tai pakartoti tiek kartų, kiek norite, kad turėtumėte kelias eilutes, padengtas komentarais, kaip šis:

// tai yra komentaras.
// tai yra kitas komentaras.
// galite toliau komentuoti taip.

Dar viena priežastis, kodėl mes naudojame komentarus, yra tai, kad norime iškomentuoti kodo dalį, kad galėtume eksperimentuoti su kodu. Pavyzdžiui, galite parašyti tą pačią funkcionalumą keliais būdais ir norėti iškomentuoti vieną versiją to paties kodo, kad palygintumėte jų individualų našumą ar rezultatus. Pažvelkime į tai su pavyzdžiu.

Pasiruoškite ir nukopijuokite bei įklijuokite šį kodą į savo JavaScript konsolę, kurią atidarėte Chrome.

// pasveikinti vartotoją
alert("Hello, User!");
alert("Hi, User!");

Jei norite papildomos praktikos, galite parašyti visą kodą patys. Vienas dalykas, kurį turėtumėte žinoti apie kelių eilučių kodo rašymą konsolėje, yra tai, kad norint pereiti į kitą eilutę, neįvykdant jos, galite paspausti „shift + enter“. Priešingu atveju, po vienos eilutės kodo įvedimo, jei paspausite tik enter, jis vykdys tą kodo eilutę. Šiame pavyzdyje tai nėra didelė problema, ir iš tikrųjų gerai vykdyti jį eilutėmis, nes turime paprastą pavyzdį, kuris taip pat gali veikti tokiu stiliumi.

Po to, kai nukopijuosite ir įklijuosite arba parašysite kodą patys, paspauskite „enter“, kad vykdytumėte kodą. Rezultatas turėtų suteikti jums du atskirus įspėjimus. Taip pat, norėdami atmesti įspėjimus, galite paspausti „OK“, šiuo atveju jie nieko nedarys, nes tai yra paprastas įspėjimas ir jis nesukelia nieko po to, kai parodome norimą pranešimą.

Kai vykdome kodą tokiu būdu, mes vykdome tą pačią funkcionalumą du kartus. Bet ką turėtumėte daryti, jei norite matyti tik vieną įgyvendinimą vienu metu? Na, jūs žinote, ką daryti šiuo atveju, nes jau apie tai kalbėjome. Pasiruoškite ir iškomentuokite vieną iš eilučių po to, kai įklijavote arba parašėte kodą, kad tik antrasis „Hi, User!“ įgyvendinimas būtų vykdomas.

Kai baigsite iššūkį, arba jei užstrigsite per iššūkį, galite pamatyti sprendimo kodą žemiau. Prieš žiūrėdami į sprendimą, visada labai rekomenduoju pabandyti patys, nes geriausiai išmoksite, kai tikrai praktikuojate. Jei sėkmingai įvykdėte iššūkį, turėtumėte matyti ekraną, panašų į šį:

Atkreipkite dėmesį, kad kai iškomentuojate kodo eilutę, ji tampa tokios pačios spalvos kaip ankstesnė komentuota eilutė. Ši spalvų skirtumas iš tikrųjų neturi jokios reikšmės kompiuteriui, tačiau tai yra gana naudinga funkcija mums, kai rašome kodą. Taip daug lengviau, jei netyčia iškomentuojate kodo eilutę, nes spalvos padarys tai akivaizdu.

Dar vienas būdas komentuoti kodą yra naudoti brūkšnelį ir žvaigždutės simbolį. Taip galime kurti vienos eilutės arba kelių eilučių komentarus savo kode.

/* vienos eilutės komentaras *//* komentaras prasideda, kai įdedame brūkšnelį ir žvaigždutę
ir komentuojamos sritys baigiasi
kai uždarome komentarą su žvaigždute ir brūkšniu
taip */

Dabar žinote JavaScript pagrindus. Kitame mokyme pamatysime labai dažną programavimo koncepciją, vadinamą „kintamaisiais“, kartu su pagrindiniais duomenų tipais JavaScript.