Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Tworzenie wtyczki jQuery / różne sposoby tworzenia i rozszerzania klas
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
pp-layouts
Założenie testowe: prosta, ćwiczebna wtyczka do jQuery, która zaznacza checkboxa.

Oto 3 pierwsze z brzegu style zapisania czegoś takiego:

[JAVASCRIPT] pobierz, plaintext
  1. $.fn.extend = {
  2.   check : function() {
  3.     for (var i in this) this[i].checked = true;
  4.     return $(this);
  5.   }
  6. }
[JAVASCRIPT] pobierz, plaintext

[JAVASCRIPT] pobierz, plaintext
  1. $.fn.check = function() {
  2.   for (var i in this) this[i].checked = true;
  3.   return $(this);
  4. }
[JAVASCRIPT] pobierz, plaintext

[JAVASCRIPT] pobierz, plaintext
  1. jQuery.prototype.check = function() {
  2.   for (var i in this) this[i].checked = true;
  3.   return $(this);
  4. }
[JAVASCRIPT] pobierz, plaintext
Pierwszy ze sposobów jest oficjalnie opisany w dokumentacji jQuery, jest przejrzysty, oszczędza czas i miejsce jak chce dodać się kilka metod. Drugi jest też niczego sobie. Chyba najprostszy i najoczywistszy. Trzeciego nigdzie nie widziałem, sam na niego wpadłem i sprawdziłem, że działa. Dodatkowo, analizator kodu z NetBeans rozumie ten zapis, i oferuje uzupełnianie kodu dla $(). Nie robi tego dla pierwszych dwóch zapisów. KomodoEdit jest tutaj lepszy, bo rozumie $.fn.extend. Za to chyba nie rozumie za bardzo JSDoc, chociaż w podstawach wspiera.



Co sądzicie o tych sposobach. Czy są równoważne? Czy któreś z nich są lepsze lub gorsze, a jeśli tak to dlaczego?
zegarek84
prototype - luknij...

co do szybkości się nie wypowiadam za wiele, ale o ile dobrze pamiętam, to jeśli .extend rozszerza funkcjonalność konstruktora obiektu to będzie najwolniejsze gdyż korzysta właśnie z prototype lub czegoś podobnego, tworząc kolejne obiekty z konstruktora będą posiadały tą metodę (dawno bibliotek nie przeglądałem), a jeśli rozszerza tylko jeden już stworzony obiekt to będzie wolniejszy od bezpośredniego przypisania metody jak w przykładzie nr 2 gdyż tak to będzie robiło...

prototype służy do rozszerzenia ale już konstruktora obiektu - jeśli będziesz tworzył kolejne instancje przez new funkcja to będą one posiadały te metody wszystkie...

ogólnie jeśli używasz słowa prototype to wszystkim (większości) to się kojarzy właśnie z biblioteką o tejże nazwie - mimo, iż podobno jest ona wolna to kod ma samodokumentujący się - warto na niego rzucić okiem by poznać kilka sposobów tworzenia obiektów...

ja z bibliotek chociaż nie korzystam, to je przeglądałem dawniej trochu...
pp-layouts
W jQuery to nie może być wolne winksmiley.jpg Tam nic nie jest wolne winksmiley.jpg Ale masz rację, że tak czy śmak funkcja extend i tak wywołuje prototype. Oprócz tego mogłaby jeszcze coś robić, ale z drugiej strony, jak kod jest zoptymalizowany, to raczej nic ponad to, co jest absolutnie koniecznie.

Ciekawe, że analizator kodu w NetBeans jest na tyle sprytny, że wyświetla w podpowiedziach nowe metody do $(), chociaż rozszerzałem klasę jQuery, nie $. Definicja samego jQuery wygląda tak:

... = window.jQuery = window.$ = function( selector, context ) { ... } ...


Wydaje mi się, że przypisania są wykonywane wewnętrznie przez referencję. Więc wszystko jedno co rozszerzę. Najbliżej źródła jest window.$, ale nie dla analizatora kodu z NetBeans. Jak rozszerzam $, nie łapie. W wersji 1.4alpha jest dokładnie odwrotnie. Ale odradzam używanie, we wszystkich IE robi stack overflow.

Zostawiłem w projekcie wtyczki via jQuery.prototype. Dodają mi się nie tylko w NetBeans, ale nawet w Komodo Edit (który lubię bo jest nieco szybszy od NB).

Co ważne - jak spakujesz kod JS packerem, lepiej zmienić mu rozszerzenie z .js np na js.packed, inaczej IDE próbują to analizować, i taki NetBeans się praktycznie wiesza od tego. Po zmianie rozszerzeń musiałem jeszcze wyczyścić mu cache, bo uzupełnianie kodu zupełnie mu siadło.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.