Šiuolaikiškas JavaScript su ES6–ES13 (JS pamokos)

Tave laukia šio JavaScript ES6 kursas.

JavaScript jau daugelį metų yra naršyklėse. Beveik kiekvienas tinklalapis turi daugiau ar mažiau JS kodo. Nors pirmosios versijos buvo gan prastokos, su ES5 standartu vis dar galima buvo gerai dirbti, bent jau jei išmanėte gudrybes ir atsitiktinius sunkumus. Taigi kodėlgi mokytis kažko naujo, o ne pasilikti patiems tikrinamiems ginklus? Šioje pamokoje aš parodysiu naujo standarto ES6 privalumus ir pateiksiu priežastis, kodėl jums iš tikrųjų nereikėtų jo ignoruoti.

Iki ir įskaitant ES5, raktažodis var buvo vienintelis būdas deklaruoti kintamuosius, dažnai sukeliantis nepageidaujamą elgesį ar net klaidas. ES6 į rinką išsiuntė du naujus raktažodžius let ir const, kurie ištaiso kai kurias var trūkumų.

Kiekvienas interneto kūrėjas žino „for“ ciklą. Jis dažnai naudojamas masyvų perėjimui. Su ES6 yra „for“ ciklo variacija, kuri tai leidžia žymiai trumpiau ir kompaktiškiau.

Funkcijos yra esminės JS ir iki šiol buvo deklaruojamos ir apibrėžiamos tik naudojant raktažodį function. ES6 įveda labai elegantišką ir trumpą rašymo būdą, kuris ne tik padaro kodą lengviau skaitomą, bet taip pat siūlo sprendimą vienam nuobodžiam problemos su this.

Neprivalomi parametrai ES5 gali būti įgyvendinami šiek tiek sudėtingai ir nepasireiškia funkcijos šaukėjui. Naudojant ES6, neprivalomi parametrai su savo numatytosiomis vertėmis gali būti tiesiogiai įrašyti į funkcijos parašą.

Destruktūrizavimas leidžia tiksliai išgauti elementus iš objektų ir masyvų. Atidžiau pažvelgus, atsiranda daug taikymo galimybių, kurios JS kodą daro elegantiškesnį ir kompaktiškesnį.

Operacijos su arguments-kintamuoju iki ES6 buvo būtinas, norint leisti funkcijoms priimti kintamą parametrų skaičių. ES6 tai yra daug lengviau su vadinamaisiomis likučių parametrais.

Ne tik funkcijų apibrėžimuose …-operatorius naudojamas likusių parametrų atveju, jis taip pat gali būti naudojamas masyvo dekonstravimo metu, kad būtų galima atkurti „likusias“ elementų dalis ir pateikti jas kaip masyvą.

Ne tik masyvuose galima naudoti liekanos operatorių, bet ir objektuose jis gali sugriebti likusias savybes ir pateikti jas kaip objektą.

Reversas nuo likučio operatoriaus yra išplatinimo operatorius. Jis atrodo taip pat (…), bet yra priešingame priskyrimo pusėje ir išskleidžia masyvą į atskiras dalis.

"Triukas" su skleidimo operatoriumi veikia labai gerai net su objektais. Taip galima įterpti objektus į kitus objektus. Tačiau šiems tikslams yra labai geras Object.assign() alternatyva.

Funkcijos objektų literaluose rašyti labai sudėtinga su function- raktu. Tačiau naudojant ES6, jas galima rašyti daug trumpiau ir aiškiau.

Niekas negali paneigti: daugelio eilučių simbolių literai su integruotų kintamųjų vertėmis buvo kančia ir labai nemalonus skaityti iki ES6. ES6 nauji šablonai, priešingai, yra sintaksinė palaima.

Objektai visą laiką galėjo būti naudojami kaip raktų-vertės saugykla ar Žodynas, tačiau su kai kuriais trūkumais. Nauja Map duomenų struktūra atmeta tuos trūkumus ir teikia patikimą žodynų funkcionalumą, toks, kokį žinome iš kitų programavimo kalbų.

Po Promisų galima išvengti atgalinio kvietimo pragaro, async/await konstrukcija dar labiau prisideda prie sintaksės paprastumo. Ji remiasi Promisais ir leidžia programuoti asinchroninius procesus beveik taip pat kaip sinchroninius. Kas nors bent kartą programavęs su async/await, nuo to laiko vengia tiesioginio Promisų then-metodo naudojimo (ir dar labiau vengia atgalinių iškvietimų naudojimo).

Beu statinio modulių importavimo su raktu import, ES6 taip pat palaiko dinaminį importavimą naudojant import-funkciją. Kadangi viskas veikia asinchroniškai, grąžinamas promises, kurių atsakymą galima palaukti naudojant await funkciją. Taigi, modulių pakrovimui vykdymo metu nieko nekliudo.

Paveldėjimas ir toliau remiasi prototipais, tačiau ES6 jis užrašomas naudojant extends raktažodį, kuris žymiai patogesnis ir aiškesnis. Jį naudojant, būtina tinkamu metu iškviesti pagrindinės klasės konstruktorių naudojant super. Kaip tai padaryti, žinoma, bus paaiškinta šiame pamokoje.

Taip pat galima apibrėžti privačius laukus, prie jų garantuotai nepasieksite iš išorės. Šiek tiek priprasti reikia prie deklaracijos, kuri išsiskiria iš kitų programavimo kalbų.

Naujuoju žodžiu klasė ir susijusiomis funkcijomis, tokiomis kaip paveldėjimas ir duomenų uždarumas (privačios narystės), visi OO-programuotojai turėtų būti patenkinti, ar ne? Šioje pamokoje noriu pristatyti alternatyvą objektų kūrimui, kuri visiškai išsieina be klasių, prototipų ir tėvinio komponento, tačiau leidžia lankstesnį „paveldėjimą“ arba geriau „kompoziciją“.

Svarbiausios ES6 versijos ir naujesnių funkcijos dabar turėtų būti aptartos. Tačiau vis dar pridėjamos naujovės. Kai kurios mažiau naudojamos funkcijos dar nebuvo paminėtos. Šioje pamokoje bus paaiškinta, ką dar galima tikėtis ateityje ir kurios funkcijos gali būti įdomios specialiuose atvejuose.