Sisällysluettelo[Piilottaa][Näytä]
- 1. Paranna perustietojasi
- 2. Hyödynnä olio-strategiaa
- 3. Hyödynnä toimintoja, vaikka ne olisivat pieniä
- 4. Käytä ==:n sijaan ===
- 5. Käytä JSLintiä
- 6. Skriptit tulee sijoittaa sivusi alaosaan
- 7. Nopein tapa tehdä merkkijono
- 8. Lisää kommentti koodiisi
- 9. Käytä mallikirjaimeja
- 10. Iteraattorit ja ... of Loops
- 11. Käytä {} uuden objektin () sijaan
- 12. Harkitse let ja const lisäämistä koodiisi
- 13. eval() ei ole hyvä idea
- 14. Spread Operator on kätevä
- 15. odota ja async
- 16. Käytä JavaScriptissä include()-menetelmää
- 17. Poista kohteet taulukosta Splice-toiminnolla
- 18. Käytä nuolitoimintoa
- 19. Destructuring-toiminnolla voit määrittää nopeasti muuttujan arvoja
- 20. Tee useita projekteja
- Yhteenveto
Jos olet koskaan ollut kiinnostunut verkkokehityksestä, olet todennäköisesti törmännyt JavaScriptiin. Olio-ohjelmointikieli on JavaScript. Kehittäjät tekevät sen avulla verkkosivujen asiakaspuolen (etuosa) dynaamisia ja interaktiivisia.
Sitä käytetään myös web-sivujen ja verkkosovellusten luomiseen HTML:n ja CSS:n avulla. Nykyään Internetissä ei ole verkkosivua, jolla ei olisi JavaScript-koodia. Siitä on tullut erottamaton osa kehittäjän työtä.
Itse asiassa se kasvaa jatkuvasti. Vaikka JavaScript tunnetaan parhaiten toiminnallisuuden tarjoamisesta verkkosivuille, sitä käytetään myös muissa kuin JavaScript-ympäristöissä. Node.js, Apache Couch-DB ja Adobe Acrobat ovat esimerkkejä näistä teknologioista. Useimmat nykyaikaiset verkkoselaimet sisältävät JavaScript-suoritusmoottorin. Jos haluat olla menestyvä verkkokehittäjä, joudut käsittelemään JavaScriptiä.
Sinun on puututtava siihen tänään tai huomenna. Mikset oppisi JavaScriptiä etukäteen, jotta olet valmis, kun sen aika tulee?
Tämän opit tässä istunnossa. Se selittää, kuinka pysyt askeleen edellä web-kehittäjiäsi hiomalla JavaScriptiäsi.
Aloitetaanpa!
1. Paranna perustietojasi
Aloitan todella perusajattelulla ja lausunnolla, jonka olet kuullut nuoresta asti. Opi perusasiat ja käytä niitä käytännössä. Usein käytät logiikkaa koodauksen kanssa, mutta unohdat, että sille on jo sisäänrakennettu toiminto, kuten taulukon viipalointi. Kun suoritat JavaScript-koodin, saatat saada virheilmoituksen, ja sen seurauksena monet lisäominaisuudet lakkaavat toimimasta.
Tämä voi johtua yhdestä kaksoispisteestä tai käänteisistä pilkuista. Nämä asiat johtuvat perusasioiden ymmärtämättömyydestä. Monta kertaa yhdessä ohjelmassa käytetään perussilmukkaa, kuten for, joka tai do while. Silmukat ovat yksi perusohjelmointirakenteista.
On melko vaikeaa koodata, ja sinulla on jopa mahdollisuus työskennellä yrityksessä, jos et tunne looppausta ja muita perusteita. Perustietojesi harjaus on erittäin tärkeää, koska ne tarjoavat vankan perustan ratkaisun monimutkaisen logiikan ja maineen kehittämiseen.
2. Hyödynnä olio-strategiaa
Olio-menetelmä on nykyään tunnetuin ohjelmointitapa. Olio-lähestymistapa, joka alkoi C++:sta, on kasvanut valtavasti sen jälkeen. Nykyään kaikkien tärkeimpien kielten luomiseen käytetään vain olio-ohjelmointia. Oliokeskeinen strategia on strategia, joka keskittyy tiettyyn kohteeseen.
Esineestä tulee sitten peruskokonaisuus. Tätä objektia käytetään sitten attribuuttien ja funktioiden lisäämiseen sivulle perustana. Voit myös käyttää perinteistä menetelmää koodin luomiseen ylhäältä alas ilman toimintoja tai objekteja. Tämä on aivan liian laaja, eikä sitä pidä koskaan yrittää. Koodia kehitettäessä tulee käyttää toiminnallista lähestymistapaa, ja jos hyödynnetään funktioita, niin objekteja.
Yritä siis aluksi muuntaa laaja koodisi oliopohjaiseksi koodiksi ja kirjoita koodisi aina oliosuuntautuneeseen tyyliin. Kun tutkit muiden ihmisten koodia, katsot jatkuvasti oliokeskeisiä tekniikoita. Jos haluat hallita JavaScriptiä, on parasta, jos saat sen käsiisi.
3. Hyödynnä toimintoja, vaikka ne olisivat pieniä
Ohjelmointi toiminnallisella lähestymistavalla on loistava tapa edetä. Miksi? Se erottaa ohjelmistosi moduuleiksi, jotka toimivat yhdessä, mutta ovat silti erillään toisistaan. Annan sinulle esimerkin, joka auttaa sinua ymmärtämään.
Kokonaislukujen neliökeskiarvo voidaan laskea funktiolla. Tätä varten sinun on neliöitävä kokonaisluvut, laskettava niiden keskiarvo ja laskettava sitten keskiarvon neliöjuuri. Prosessissa on kolme vaihetta. Tämän seurauksena voimme käyttää kolmea toimintoa. Mutta kuten näet, kaikki nämä toiminnot ovat yhteydessä toisiinsa. Yhden tulos lähetetään toiselle, ja saamme lopullisen tuloksen.
Oletetaan, että kolmen funktion sijasta tarvitset vain yhden RMS:n laskemiseen useiden tekijöiden perusteella. Lopullinen ratkaisu, kuten näet, on virheellinen. Sinun on melko vaikea määrittää, mikä meni pieleen niin suuressa tapahtumassa tässä vaiheessa.
Toisaalta kolme pientä toimintoa mahdollistavat nopean analysoinnin. Tämän seurauksena, vaikka funktiot ovat vaatimattomia, käytä niitä erillisten koodimoduulien määrittämiseen. Tämä tekniikka auttaa sinua tulemaan JavaScript-asiantuntijaksi kuin magic.
Katsotaanpa nyt joitain JavaScript-koodausvinkkejä.
4. Käytä ==:n sijaan ===
JavaScriptissä on kahdenlaisia tasa-arvooperaattoreita: tiukat tasa-arvooperaattorit === ja !== sekä ei-tiukat tasa-arvooperaattorit == ja !=. Vertailussa parhaana käytäntönä pidetään aina täsmällistä tasa-arvoa. Kun työskentelet ==:n ja !=:n kanssa, joudut kuitenkin ongelmiin käsiteltäessä erilaisia tyyppejä.
Kun vertailemiesi arvojen tyypit ovat erilaisia, ei-tiukat operaattorit yrittävät pakottaa arvojaan, mikä saattaa johtaa odottamattomiin tuloksiin.
5. Käytä JSLintiä
Douglas Crockford loi JSLint, virheenkorjaajan. Laita vain käsikirjoituksesi laatikkoon, ja se tarkistaa sen nopeasti virheiden tai puutteiden varalta.
JSLint tutkii JavaScript-lähdetiedoston. Jos ongelma havaitaan, se lähettää viestin, jossa on ongelman kuvaus ja likimääräinen sijainti lähteessä. Ongelma ei aina ole syntaktinen virhe, vaikka niin usein onkin.
JSLint tutkii sekä tyylinormeja että rakenteellisia kysymyksiä. Se ei tarkoita, että ohjelmistosi on oikea. Se vain lisää toisen silmäparin auttamaan ongelmien havaitsemisessa. Ennen kuin kirjaudut ulos komentosarjasta, suorita se JSLintin kautta varmistaaksesi, että et ole tehnyt virheitä.
6. Skriptit tulee sijoittaa sivusi alaosaan
Käyttäjän ensisijaisena tavoitteena on, että sivu latautuu mahdollisimman nopeasti. Selain ei voi jatkaa skriptin lataamista ennen kuin koko tiedosto on ladattu. Tämän seurauksena käyttäjän on odotettava pidempään nähdäkseen edistymisen.
Jos sinulla on JS-tiedostoja, joita käytetään vain toimintojen tarjoamiseen (esimerkiksi kun painiketta painetaan), sijoita ne sivun alareunaan juuri ennen sulkevaa body-tagia. Tämä on epäilemättä paras käytäntö.
7. Nopein tapa tehdä merkkijono
Kun sinun täytyy kiertää taulukkoa tai objektia, älä aina käytä Truty for loop -lausetta. Käytä mielikuvitustasi löytääksesi nopeimman ratkaisun käsillä olevaan tehtävään. En aio tuoda sinulle numeroita; sinun täytyy yksinkertaisesti luottaa minuun (tai testata itse).
Tämä on tähän mennessä nopein tekniikka.
8. Lisää kommentti koodiisi
Se voi aluksi vaikuttaa turhalta, mutta luota minuun, kun sanon, että sinun tulisi kommentoida koodiasi mahdollisimman usein. Mitä jos palaat projektiin kuukausia myöhemmin etkä muista alkuperäistä ajatusprosessiasi?
Entä jos jonkun työtoverisi on päivitettävä koodisi? Koodisi tärkeitä kohtia tulee aina kommentoida.
9. Käytä mallikirjaimeja
Kaksois- tai yksittäislainausmerkeillä luotujen merkkijonojen rajoitukset ovat lukuisia. Jotta niiden kanssa työskenteleminen olisi paljon helpompaa, voit korvata osan merkkijonoistasi malliliteraaaleilla.
Backtick-merkkiä (') käytetään malliliteraalien rakentamiseen, jolla on useita etuja. Voit käyttää niitä lausekkeiden tallentamiseen tai monirivisten merkkijonojen rakentamiseen.
Kuten näet, toisin kuin perinteinen merkkijonoliteraali, joka on rakennettu kerta- tai kaksoislainausmerkeillä, meidän ei tarvinnut toistuvasti mennä sisään ja ulos malliliteraalista. Tämä minimoi kirjoitusvirheiden todennäköisyyden ja mahdollistaa puhtaamman koodin kirjoittamisen.
10. Iteraattorit ja ... of Loops
Iteraattorit ovat JavaScriptin objekteja, jotka toteuttavat next()-menetelmän palauttamaan objektin, joka tallentaa sekvenssin seuraavan arvon sekä tosi tai epätosi sen mukaan, onko arvoja jäljellä. Tämä tarkoittaa, että jos otat käyttöön iteraattoriprotokollan, voit rakentaa omia iteraattoriobjekteja.
JavaScriptissä on joitain sisäänrakennettuja iteraattoreita, kuten merkkijono, taulukko, kartta ja niin edelleen. Voit käyttää ... of silmukoita iteroidaksesi niiden läpi. Verrattuna tavallisiin silmukoisiin tämä on ytimekkäämpi ja vähemmän virhealtis. Meidän ei tarvitse seurata taulukon koko pituutta tai nykyistä indeksiä käyttämällä for…of-silmukkaa. Sisäkkäisiä silmukoita suunniteltaessa tämä saattaa auttaa yksinkertaistamaan koodia.
11. Käytä {} uuden objektin () sijaan
JavaScriptissä voit tehdä objekteja monin eri tavoin. Uuden konstruktorin käyttäminen, kuten kuvassa, on perinteisempi tapa. Tämä strategia on toisaalta merkitty "huonoksi käytännöksi".
Se ei ole tuhoisa, mutta se on hieman sanallinen ja ainutlaatuinen. Ehdotan sen sijaan objektiliteraalitekniikan käyttöä.
12. Harkitse let ja const lisäämistä koodiisi
Let-avainsanalla voimme tehdä paikallisia muuttujia, jotka on rajattu omaan lohkoonsa. Voimme käyttää const-avainsanaa paikallisten lohkolaajuisten muuttujien rakentamiseen, joita ei voi muuttaa.
Kun määrität muuttujia, sinun tulee harkita let- ja const-avainsanojen käyttöä tarvittaessa. Muista, että const-avainsana estää vain uudelleenmäärityksen. Se ei myöskään tee muuttujasta muuttumatonta.
13. eval() ei ole hyvä idea
Eval()-menetelmä antaa meille pääsyn JavaScriptin kääntäjään niille, jotka eivät tiedä. Pohjimmiltaan voimme käyttää eval-funktiota merkkijonon tuloksen suorittamiseen antamalla sen syötteenä ().
Tämä ei ainoastaan hidasta käsikirjoitusta merkittävästi, vaan se tarjoaa myös merkittävän turvallisuusongelman, koska se antaa välitetylle tekstille aivan liikaa valtaa. Vältä sitä hinnalla millä hyvänsä!
14. Spread Operator on kätevä
Oletko koskaan tarvinnut lähettää kaikki taulukon kohteet yksittäisinä elementteinä toiseen funktioon vai pitääkö sinun laittaa kaikki arvot taulukosta toiseen? Juuri tämän leviämisoperaattorilla (…) voimme saavuttaa. Tässä on esimerkki.
15. odota ja async
Luo asynkronisia toimintoja asynkronisella avainsanalla, joka palauttaa aina lupauksen, joko suoraan tai epäsuorasti.
Odota-avainsanaa voidaan käyttää asynkronisissa funktioissa suorituksen pysäyttämiseen, kunnes palautuvien lupausten ratkaisu on valmis. Async-toiminnon ulkopuolella koodi jatkaa normaalisti.
16. Käytä JavaScriptissä include()-menetelmää
JavaScriptissä include()-funktio määrittää, sisältääkö merkkijono syötetyt merkit vai sisältääkö matriisi määritetyn elementin.
Tämä menetelmä palauttaa tosi, jos merkkijono tai elementti löydetään; muussa tapauksessa se palauttaa epätosi. On syytä mainita, että Strings include() -funktio on isojen ja pienten kirjainten välinen ero. Jos haluat täsmäyttää merkkijonon kirjainkoosta riippumatta, kirjoita ensin kohdeteksti pienillä kirjaimilla.
17. Poista kohteet taulukosta Splice-toiminnolla
Olen nähnyt kehittäjien käyttävän poistotoimintoa kohteen poistamiseksi taulukosta. Tämä on virheellinen, koska objektin poistamisen sijaan poistomenetelmä korvaa sen määrittämättömällä.
Helpoin tapa poistaa elementti taulukosta riippuen sen arvosta JavaScriptissä on käyttää indexOf()-funktiota saadakseen kyseisen arvon indeksinumeron taulukosta ja poistaa sitten kyseinen indeksiarvo splice()-menetelmällä.
18. Käytä nuolitoimintoa
Nuolifunktiot ovat toinen tärkeä ominaisuus, joka on juuri lisätty JavaScriptiin.
Niissä on paljon etuja. Aluksi ne tekevät JavaScriptin toiminnallisista osista visuaalisesti houkuttelevampia ja helpompia kirjoittaa. Nuolitoimintojen käyttäminen tekee tästä kuitenkin paljon luettavamman ja tiiviimmän.
19. Destructuring-toiminnolla voit määrittää nopeasti muuttujan arvoja
Aiemmin tässä viestissä opimme leviämisoperaattorista JavaScriptissä. Destructuring on samanlainen kuin purkaminen siinä mielessä, että se myös purkaa taulukoiden sisältämiä tietoja.
Erona on, että nämä pakkaamattomat arvot voidaan määrittää erillisille muuttujille. Syntaksi on identtinen []-pikakuvakkeen kanssa taulukkoa muodostettaessa. Sulut on kuitenkin tällä kertaa sijoitettu tehtäväoperaattorin vasemmalle puolelle. Tässä on esimerkki.
20. Tee useita projekteja
Jokainen lahjakkuus vaatii johdonmukaista harjoittelua, joten yritä rakentaa erilaisia projekteja kykyjesi hiomiseksi ja asiantuntemuksen hankkimiseksi erilaisissa ohjelmointiskenaarioissa.
Projektien parissa työskennellessäsi kohtaat useita haasteita ja vikoja, jotka antavat sinulle tarvittavan asiantuntemuksen. Yritä siis keksiä projekteja, ja Internetistä löytyy lukuisia ideoita ja esimerkkejä avuksesi. Jatka koodin kehittämistä, niin kykysi paranevat.
Yhteenveto
Tietokonekielen, kuten JavaScriptin, oppiminen voi olla vaikeaa. Jos aiot tosissasi tulla hyväksi ohjelmoijaksi ja hankkia ensimmäisen työpaikkasi, nämä JavaScript-oppimisstrategiat voivat auttaa sinua nopeuttamaan oppimisprosessia.
Varmista, että harjoittelet koodausta säännöllisesti, tee perusteellisia muistiinpanoja oppiessasi uusia ideoita ja hyödynnä kaikkia käytettävissäsi olevia työkaluja. Ennen kaikkea astu ulos ja aloita koodaaminen samalla kun pidät hauskaa.
Jätä vastaus