Jak správně používat jQuery

Je skoro na každém webu, ne každý ho ale umí správně používat. Řeč je o velké JavaScriptové funkci jQuery

Všichni, co používají JavaScriptové knihovny, by v ideálním případě měli vědět, jak takovou věc správně používat. Dnes velmi populární jQuery knihovna je častokrát nevhodně používána a vývojář kolikrát ani neví, jak by zápis s ní měl vypadat. Přitom vůbec nejde o nic složitého.

Ukázka nevhodně psaného JavaScriptového kódu

$("#categories .category").each(function (index) {
    // před název kategorie vloží číslo
    $(this).find(".name").text(index + ". " + $(this).find(".name"));
    if ($(this).find(".description").height() > 200) {
        $(this).find(".description").addClass("longer");
    }
});

Co je špatně na kódu, který ale funguje správně a podle očekávání? Jeho zápis. Přirovnal bych to třeba k nákupu, při kterém je ideální nakoupit věci, co jsou zrovna potřeba, protože ty ostatní, nakoupené navíc se nestihnout spotřebovat a vyhodí se. Takže proč stejnou logiku nepoužít i při psaní kódu a jak by tedy měl kód lépe vypadat?

Více přijatelný kód se stejnou funkčností

var categories = $("#categories .category");
categories.each(function (index) {
     var category = $(this),
         name = category.find(".name"),
         description = category.find(".description");

    // před název kategorie vloží číslo
    name.text(index + ". " + name);
    if (description.height() > 200) {
        description.addClass("longer");
    }
});

Co se získá tímto zápisem?

  • Nevytváření dalších a dalších zbytečných objektů jQuery, které se stejně zahodí,
  • díky používání proměnných se kód lehce krokuje,
  • přehlednější kód,
  • rychlost.

Komentáře