Tartalomjegyzék[Elrejt][Előadás]
- 1. Fejlessze alapismereteit
- 2. Használjon objektum-orientált stratégiát
- 3. Használja ki a funkciókat még akkor is, ha kicsik
- 4. == helyett használja az ===-t
- 5. Használja a JSLint-et
- 6. A szkripteket az oldal alján kell elhelyezni
- 7. A húrkészítés leggyorsabb módja
- 8. Írjon megjegyzést a kódhoz
- 9. Használja a Sablon Literálokat
- 10. Iterátorok és… a hurkok számára
- 11. Használja a {} parancsot a new Object() helyett
- 12. Vegye fontolóra let és const beírását a kódjába
- 13. eval() nem jó ötlet
- 14. A Spread Operator jól jön
- 15. vár és async
- 16. Használja az include() metódust a Javascriptben
- 17. Távolítsa el az elemeket egy tömbből a Splice segítségével
- 18. Használja a nyíl funkciót
- 19. A Destructuring segítségével gyorsan hozzárendelhet változó értékeket
- 20. Készítsen több projektet
- Következtetés
Ha valaha is érdekelt a webfejlesztés, valószínűleg találkozott már a JavaScripttel. Egy objektum-orientált programozási nyelv a JavaScript. A fejlesztők arra használják, hogy a weboldalakat kliensoldali (front end) dinamikussá és interaktívvá tegyék.
Weboldalak és webalkalmazások létrehozására is használható HTML és CSS segítségével. Manapság nincs olyan weboldal az interneten, amely ne tartalmazna JavaScript kódot. Ez a fejlesztői munka elválaszthatatlan elemévé vált.
Valójában folyamatosan növekszik. Bár a JavaScriptet leginkább a weboldalak funkcionalitásának biztosítására ismerik fel, nem JavaScript-környezetekben is használják. A Node.js, az Apache Couch-DB és az Adobe Acrobat példák ezekre a technológiákra. A JavaScript futtatásához a legtöbb modern webböngésző beépített JavaScript-végrehajtó motort tartalmaz. Ha sikeres webfejlesztő szeretne lenni, meg kell küzdenie a JavaScripttel.
Ma vagy holnap foglalkoznod kell vele. Miért nem tanulja meg a JavaScriptet idő előtt, hogy készen álljon, amikor eljön az ideje?
Ezt fogod megtanulni ezen a foglalkozáson. Elmagyarázza, hogyan maradhat egy lépéssel webfejlesztő kollégái előtt a JavaScript csiszolásával.
Kezdjük!
1. Fejlessze alapismereteit
Egy igazán alapvető gondolattal és kijelentéssel kezdem, amit fiatalkorod óta hallottál. Tanuld meg az alapokat és alkalmazd őket a gyakorlatba. Sokszor logikát fogsz alkalmazni kódolással, de elfelejted, hogy már van egy beépített függvény hozzá, például egy tömb felszeletelése. A JavaScript kód futtatásakor hibaüzenetet kaphat, és ennek eredményeként számos további funkció leáll.
Ezt egyetlen kettőspont vagy fordított vessző okozhatja. Ezek a dolgok az alapok megértésének hiánya miatt következnek be. Egyetlen programban sokszor olyan alaphurkot alkalmaznak, mint a for, which, or do while. A hurkok az egyik legalapvetőbb programozási konstrukció.
Meglehetősen nehéz kódolni, és még egy cégnél is van esélye dolgozni, ha nem ismeri a loopolást és más alapokat. Az alapok felfrissítése kritikus fontosságú, mivel szilárd alapot biztosítanak a megoldás bonyolult logikájának és hírnevének fejlesztéséhez.
2. Használjon objektum-orientált stratégiát
Az objektum-orientált módszer ma a legismertebb programozási megközelítés. Az objektum-orientált megközelítés, amely a C++ nyelvvel kezdődött, azóta rendkívül népszerűvé vált. Ma már csak objektumorientált programozást használnak az összes fő nyelv létrehozására. Az objektum-orientált stratégia egy adott objektumra összpontosít.
Az elem ezután alapvető entitássá válik. Ez az objektum ezután attribútumok és függvények hozzáadására szolgál alapként az oldalhoz. Használhatja a hagyományos módszert is a kód létrehozására felülről lefelé, függvények vagy objektumok nélkül. Ez túl kiterjedt, és soha nem szabad megkísérelni. A kód fejlesztésénél funkcionális megközelítést alkalmazzunk, ha pedig függvényeket használunk, akkor objektumokat.
Kezdetben tehát törekedjen arra, hogy kiterjedt kódját objektum-orientált kóddá alakítsa, és mindig objektum-orientált stílusban írja meg a kódot. Amikor mások kódját tanulmányozza, folyamatosan objektum-orientált technikákat fog vizsgálni. Ha szeretné elsajátítani a JavaScriptet, a legjobb, ha kézbe veszi.
3. Használja ki a funkciókat még akkor is, ha kicsik
A funkcionális megközelítéssel történő programozás nagyszerű út. Miért? A szoftvert olyan modulokra osztja, amelyek együtt működnek, de mégis különböznek egymástól. Hadd mondjak egy példát, ami segít megérteni.
Az egész számok négyzetgyökértéke függvény segítségével számítható ki. Ehhez négyzetre kell emelni az egész számokat, ki kell számítani az átlagukat, majd ki kell számítani az átlag négyzetgyökét. A folyamatnak három fázisa van. Ennek eredményeként három funkciót tudunk alkalmazni. De amint láthatja, ezek a funkciók összefüggenek egymással. Az egyik kimenetét elküldik a másiknak, és megkapjuk a végső eredményt.
Tegyük fel, hogy három függvény helyett egyszerűen csak egy kell az RMS több tényező alapján történő kiszámításához. A végső megoldás, mint láthatja, helytelen. Elég nehéz lesz eldöntened, mi rontott el egy ilyen nagy eseményen ezen a ponton.
Ezzel szemben a három apró funkció lehetővé teszi a gyors elemzést. Ennek eredményeként, még ha a függvények szerények is, használja őket külön kódmodulok meghatározására. Ez a technika segít JavaScript-szakértővé válni, mint a mágia.
Most pedig nézzünk meg néhány JavaScript kódolási tippet.
4. == helyett használja az ===-t
A JavaScriptben kétféle egyenlőségi operátor létezik: szigorú egyenlőség operátorok === és !==, valamint nem szigorú egyenlőség operátorok == és !=. Összehasonlításkor az a legjobb gyakorlat, hogy mindig a pontos egyenlőséget alkalmazzuk. Ha azonban az == és != jelekkel dolgozik, problémákba ütközik, amikor különböző típusokkal foglalkozik.
Ha az összehasonlítandó értékek típusai eltérőek, a nem szigorú operátorok megpróbálják kikényszeríteni az értékeket, ami váratlan eredményekhez vezethet.
5. Használja a JSLint-et
Douglas Crockford létrehozta a JSLint, egy hibakeresőt. Egyszerűen helyezze be a szkriptet a dobozba, és az gyorsan átvizsgálja az esetleges hibákat vagy hibákat keresve.
A JSLint megvizsgál egy JavaScript-forrásfájlt. Ha hibát észlel, üzenetet küld a probléma leírásával és hozzávetőleges helyzetével a forráson belül. A probléma nem mindig szintaktikai hiba, bár gyakran ez a helyzet.
A JSLint a stilisztikai normákat és a strukturális kérdéseket egyaránt vizsgálja. Ez nem jelenti azt, hogy a szoftver pontos. Csak egy újabb szempárt ad hozzá, hogy segítse a problémák észlelését. Mielőtt kijelentkezik egy szkriptről, futtassa azt a JSLinten keresztül, hogy megbizonyosodjon arról, hogy nem követett el hibákat.
6. A szkripteket az oldal alján kell elhelyezni
A felhasználó elsődleges célja, hogy az oldal a lehető leggyorsabban betöltődjön. A böngésző nem tudja folytatni a szkript betöltését, amíg a teljes fájl be nem töltődik. Ennek eredményeként a felhasználónak tovább kell várnia az előrehaladásra.
Ha olyan JS-fájlja van, amelyet csak a funkciók biztosítására használnak (például ha megnyomnak egy gombot), helyezze őket az oldal aljára, közvetlenül a záró body címke elé. Kétségtelenül ez a legjobb gyakorlat.
7. A húrkészítés leggyorsabb módja
Ha egy tömb vagy objektum körül kell hurkolni, ne mindig használja a Truty for loop utasítást. Használja fantáziáját, és találja meg a leggyorsabb megoldást az adott feladatra. Nem fogok számokat hozni; egyszerűen csak bíznod kell bennem (vagy tesztelned kell magad).
Ez eddig a leggyorsabb technika.
8. Írjon megjegyzést a kódhoz
Elsőre értelmetlennek tűnhet, de higgyen nekem, amikor azt mondom, hogy a lehető leggyakrabban kommentálja a kódot. Mi van, ha hónapokkal később visszatér a projekthez, és nem emlékszik vissza az eredeti gondolatmenetére?
Mi van, ha a kódját valamelyik munkatársának frissítenie kell? A kód fontos területeihez mindig megjegyzést kell fűzni.
9. Használja a Sablon Literálokat
A dupla vagy szimpla idézőjelekkel létrehozott karakterláncok megszorítása számos. A velük való munka megkönnyítése érdekében dönthet úgy, hogy néhány karakterláncot sablonliterálokra cserél.
A backtick karaktert (') sablonliterálok készítésére használják, aminek számos előnye van. Használhatja őket kifejezések tárolására vagy többsoros karakterláncok létrehozására.
Amint látja, a hagyományos karakterlánc-literáltól eltérően, amelyet szimpla vagy kettős idézőjelekkel építettünk fel, nem kellett többször ki-be lépnünk a sablonliterálunkból. Ez minimálisra csökkenti a gépelési hibák valószínűségét, és lehetővé teszi számunkra, hogy tisztább kódot írjunk.
10. Iterátorok és… a hurkok számára
Az iterátorok olyan objektumok a JavaScriptben, amelyek a next() metódust valósítják meg egy olyan objektum visszaadására, amely a sorozat következő értékét, valamint igaz vagy hamis értéket tárol, attól függően, hogy van-e még érték. Ez azt jelenti, hogy ha megvalósítja az iterátor protokollt, létrehozhatja saját iterátor objektumait.
A JavaScriptben van néhány beépített iterátor, például String, Array, Map stb. Használhatja a for … of loop-ot, hogy átterelje őket. A hagyományos for ciklusokhoz képest ez tömörebb és kevésbé hibás. Nem kell nyomon követnünk a tömb teljes hosszát vagy az aktuális indexet a for…of ciklus használatával. Beágyazott hurkok tervezésekor ez segíthet a kód egyszerűsítésében.
11. Használja a {} parancsot a new Object() helyett
A JavaScriptben többféle módon készíthet objektumokat. Az új konstruktor használata, ahogy az ábrán látható, egy hagyományosabb módszer. Ezt a stratégiát viszont „rossz gyakorlatként” jelölik.
Nem romboló, de kicsit bőbeszédű és egyedi. Ehelyett az objektum szó szerinti technikát javaslom.
12. Vegye fontolóra let és const beírását a kódjába
A let kulcsszóval olyan helyi változókat készíthetünk, amelyek saját blokkjukra vannak hatókörükben. Használhatjuk a const kulcsszót olyan helyi blokk-hatókörű változók létrehozására, amelyeket nem lehet megváltoztatni.
A változók deklarálásakor érdemes megfontolni a let és const kulcsszavak használatát, ha alkalmazható. Ne feledje, hogy a const kulcsszó csak az újra hozzárendelést tiltja le. Nem teszi megváltoztathatatlanná a változót sem.
13. eval() nem jó ötlet
Az eval() metódus azok számára, akik nem ismerik, hozzáférést biztosít a JavaScript fordítójához. Lényegében az eval-t használhatjuk egy karakterlánc eredményének végrehajtására, ha bemenetként adjuk meg ().
Ez nemcsak jelentősen lelassítja a szkriptet, hanem jelentős biztonsági aggályt is jelent, mivel túlságosan nagy tekintélyt ad az átadott szövegnek. Kerülje el minden áron!
14. A Spread Operator jól jön
Szüksége volt már arra, hogy egy tömb összes elemét külön elemként továbbítsa egy másik függvénynek, vagy az egyik tömb összes értékét át kell helyeznie a másikba? A spread operátor (…) pontosan ezt teszi lehetővé számunkra. Íme egy illusztráció.
15. vár és async
Hozzon létre aszinkron függvényeket az async kulcsszó használatával, amely mindig ígéretet ad vissza, akár kifejezetten, akár implicit módon.
Az await kulcsszó aszinkron függvényekben használható a végrehajtás leállítására, amíg a visszatérő ígéretek feloldása be nem fejeződik. Az aszinkron funkción kívül a kód továbbra is a szokásos módon fut.
16. Használja az include() metódust a Javascriptben
A JavaScriptben az include() függvény határozza meg, hogy egy karakterlánc tartalmazza-e a megadott karaktereket, vagy egy tömb tartalmazza-e a megadott elemet.
Ez a metódus igazat ad vissza, ha a karakterláncot vagy elemet felfedezi; ellenkező esetben hamis értéket ad vissza. Érdemes megemlíteni, hogy a Strings include() függvény megkülönbözteti a kis- és nagybetűket. Ha a kis- és nagybetűtől függetlenül egy karakterláncot szeretne egyeztetni, először egyszerűen írja kisbetűvel a célszöveget.
17. Távolítsa el az elemeket egy tömbből a Splice segítségével
Láttam, hogy a fejlesztők a törlés funkciót használják elem eltávolításához egy tömbből. Ez hibás, mert az objektum törlése helyett a delete metódus lecseréli az undefined-re.
A legegyszerűbb módja annak, hogy eltávolítsunk egy elemet a tömbből a JavaScriptben szereplő értékétől függően, ha az indexOf() függvényt használjuk, hogy megkapjuk az adott érték indexszámát a tömbben, majd töröljük az indexértéket a splice() metódussal.
18. Használja a nyíl funkciót
A nyílfüggvények egy másik fontos funkció, amelyet most adtunk hozzá a JavaScripthez.
Rengeteg előnyük van. Először is vizuálisan vonzóbbá és könnyebben írhatóbbá teszik a JavaScript funkcionális részeit. A nyílfüggvények használata azonban ezt sokkal olvashatóbbá és tömörebbé teszi.
19. A Destructuring segítségével gyorsan hozzárendelhet változó értékeket
Ebben a bejegyzésben korábban megismerkedtünk a JavaScript terjedési operátorával. A destrukturálás abban hasonlít a destrukturáláshoz, hogy a tömbökben lévő adatokat is kicsomagolja.
A különbség az, hogy ezek a kicsomagolt értékek különböző változókhoz rendelhetők. A szintaxis megegyezik a [] parancsikonéval a tömb létrehozásakor. A zárójelek azonban ezúttal a hozzárendelési operátor bal oldalán találhatók. Íme egy illusztráció.
20. Készítsen több projektet
Minden tehetség következetes gyakorlást igényel, ezért próbáljon meg különféle projekteket felépíteni, hogy tökéletesítse képességeit és szakértelmet szerezzen különféle programozási forgatókönyvekkel.
A projekteken való munka során számos kihívással és hibával találkozik, amelyek a szükséges szaktudást biztosítják. Próbáljon tehát projekteket kidolgozni, és az interneten rengeteg ötlet és példa található a segítségére. Folytassa a kód fejlesztését, és képességei javulni fognak.
Következtetés
Lehet, hogy nehéz megtanulni egy számítógépes nyelvet, például a JavaScriptet. Ha komolyan gondolja, hogy jó programozóvá váljon és megszerezze első állását, akkor ezek a JavaScript tanulási stratégiák segíthetnek felgyorsítani a tanulási folyamatot.
Győződjön meg róla, hogy rendszeresen gyakorolja a kódolást, készítsen alapos jegyzeteket, miközben új ötleteket tanul, és használja az összes elérhető eszközt. Mindenekelőtt menjen oda, és kezdjen el kódolni szórakozás közben.
Hagy egy Válaszol