Egyéb hasznos tanácsok

Használjunk JavaScript-osztálykönyvtárat

Némileg lerövidítik a webalkalmazások fejlesztésének idejét azáltal, hogy számos olyan megoldást kapunk készen, amit eddig mindig saját kezűleg kellett implementálnunk. Legtöbbjük egy olyan alkalmazásprogramozói felületet (API) biztosít, ami megszabadítja a fejlesztőket a problémák böngészőfüggetlen kezelésétől. Végeredményben a részletek elrejtésével megkönnyítik a fejlesztők dolgát.

Hogy melyik osztálykönyvtárat használjuk, az mindig a megoldandó feladat jellegétől függ. A táblázatban felsorolt JavaScript osztálykönyvtárak közül aYUI és a Dojo teljes körű szolgáltatást nyújt, míg a többi alapkönyvtárnak tekinthető (böngészőfüggetlenség kialakítása, eseménykezelés megoldása, egyszerűsíti a programozást, növeli a kód olvashatóságát). Az előbbi két osztálykönyvtárat nem ajánlom egyszerű weboldalakhoz nagy méretük miatt. Legyünk mindig körültekintőek, mielőtt elköteleznénk magunkat egy adott osztálykönyvtár használata mellett.

Kódolási szabályok

Bár sem a szintaktika, sem a szemantika területére nem sorolható, a forráskód helyes formázása nagyon fontos az olvashatóság szempontjából. Véleményem szerint egy profi programozó legfontosabb felelőssége, hogy „ karbantartható” kódot írjon. Egy jól áttekinthető programkóddal kellemesebb dolgozni (vagy éppen hibát keresni), mint egy silányan formázott kóddal.

A helyzetet bonyolítja, hogy egy programozó sem „légüres térben” dolgozik: programjainkat jelenlegi és jövőbeli kollégáinknak kell majd karbantartaniuk. Két, önmagában megfelelő stílus keveréke viszont ugyanúgy olvashatatlan és karbantarthatatlan kódot eredményezhet, mintha semmilyen stílust nem követnénk, ezért nem csak az a fontos, hogy megfelelő stílusban programozzunk, hanem az is, hogy az együtt dolgozó fejlesztők következetesen ragaszkodjanak egy közös stílushoz.

Következzen most néhány követendő tanács:

• Bevett szokás, hogy a konstruktorként szolgáló függvények neveit nagy kezdőbetűvel látjuk el. Így a forrásprogramban azonnal megkülönböztethetőek az egyszerű függvényektől. Természetesen ez akkor valósulhat csak meg, ha tartjuk magunkat ahhoz az irányvonalhoz, hogy a változók, metódusok, egyszerű függvények neveit kis kezdőbetűvel írjuk.
• Ne hagyjuk ki a kapcsos zárójeleket. Az egysoros feltételes utasítások JavaScriptben sem követelik meg a kapcsos zárójel használatát. if (!this._currentView)
return; Annak ellenére, hogy a fenti kód szintaktikailag helyes, nem ajánlott a használata. Amennyiben egy újabb sorral szeretnénk kiegészíteni a fenti utasítást, könnyedén hibát véthetünk ha nem figyelünk eléggé.
• Privát láthatóságú (vagy annak szánt) példánymetódusok és példányváltozók azonosítói kezdődjenek aláhúzás karakterrel (_).
• Mindig tegyük ki a pontosvesszőt. JavaScriptben a pontosvessző és az új sor karakter válassza el egymástól az utasításokat. Ha egy sorban csak egy utasítás van, az utasítás végére nem kötelező pontosvesszőt tenni. Ez azonban nem jó szokás. Ha ugyanis később úgy döntünk, hogy a forráskódot lerövidítjük tömörítéssel (a forráskódból eltávolítjuk az összes felesleges szóközt, megjegyzést és új sor karaktert), a lerövidített kód nem fog működni, mivel az új sor karakterek eltávolításával az utasításokat többé semmi sem fogja elválasztani egymástól.
• A JavaScript nem ismeri a konstansokat, ezért nem biztosít védelmet az átírással szemben. Azonban a változó írásmódjával jelezhetjük a többi programozónak, hogy a változó értékét nem szabad megváltoztatni. Az ilyen változókat célszerű csupa nagybetűvel írni. Íme egy példa:

  {
      CSS_CLASS_NAME : "yuibutton",
      .
      .
  }
  

• Behúzásokra használjunk lágy tabulátort (adott számú szóköz). A lágy tabulátorok előnye, hogy mindig ugyanúgy jelennek meg. A kemény tabulátorokkal az a baj, hogy ha nem állítjuk be a szerkesztőprogramunk tabulátorbeállításait, könnyen előfordulhat, hogy a behúzási szintek összekeverednek. Miután eldöntöttük, hogy lágy vagy kemény tabulátort fogunk használni, ehhez következetesen ragaszkodni kell a kódban!

Diszkrét JavaScript

...A diszkrét Javascript azt mondja, hogy a HTML kódunkban ne használjunk Javascriptet, válasszuk le, s tegyük külön fájlba teljesen scriptjeinket, s építsük fel úgy az oldalt, hogy azok nélkül is teljes funkcionalitással bírjon - maximum nem olyan kényelmesen. Ismerősnek tűnhet az ötlet: a mai modern CSS technikák pontosan ezt mondják a stíluslapok esetén is: válasszuk szét a megjelenést és a tartalmat...

Tulajdonságfelderítéshez biztonságosabb a typeof

Böngészőfüggetlen kód írásakor gyakran van szükség bizonyos metódusok és tulajdonságok létezésének az ellenőrzésére. typeof operátor nélkül a tulajdonságfelderítés nem megbízható.

if (tulajdonsag){
…
}

Ne feledjük, hogy mi a tulajdonság, vagy metódus létezését szeretnénk leellenőrizni, nem az értékét. A fenti if utasítás zárójelek közötti kifejezése HAMIS értékre lesz kiértékelve abban az esetben is, ha a tulajdonság létezik és false, vagy 0 értéket tartalmaz. Ezen okból a typeof operátor használata ajánlott. Lássunk erre egy példát:

if (typeof XSLTProcessor != "undefined"){
..
}

Kapcsolódó linkek

• JavaScript-Fu: Guidelines for Web 2.0 Mastery

Használjunk tervezési mintákat (design patterns)

Minden minta olyan problémát ír le, ami újra és újra felbukkan a környezetünkben, s aztán leírja hozzá a megoldás magját, oly módon, hogy a megoldás milliószor felhasználható legyen, anélkül, hogy valaha is kétszer ugyanúgy csinálnánk.

Használatukkal rugalmasabban módosítható és könnyebben, jobban újrahasznosítható alkalmazásokat készíthetünk. Elsősorban a következő tervezési minták alkalmazása ajánlott: Modell-View-Controller, Singleton, Factory, Observer.

JavaScriptben az utasításblokknak nincsen scope-ja

A C nyelvben minden utasításblokk (egy { és }-el elhatárolt programrész) egy új scope-ot, érvényességi tartományt definiál. JavaScriptben csak a függvénynek van scope-ja.

var i=10;
for(var i=0; i < 5; i++){
}
alert(i); // !! az "i" változó értéke 5 lesz!

void fuggv(void){
    int a = 1;
    int b = 2;
    if (true){
        int b = 3;
        a += b;
    }
    echo a; // 4
    echo b; // 2
}
fuggv();

A függvénydefiníción belül az if utasításblokk egy újabb scope-ot hoz létre. Az if utasításblokkban egy b nevű változót hoztunk létre, ami a külső scope-ban már szerepel. A belső scope-ban szereplő b elfedi a külsőben szereplőt.

JavaScriptben belső függvény segítségével tudunk egy függvényen belül további scope-ot létrehozni. Például a következő módon:

function fuggv(){
    var a = 1;
    var b = 2;
    (function(){
        var b = 3;
        a += b;
    })();
    alert(a); // 4
    alert(b); // 2
}
fuggv();