Projektowanie i inne takie...

by Piotr

Zrozumieć Java-Script...

,

Studia to dla mnie strata czasu, o czym wie każdy, kto zna mnie osobiście i był nie raz świadkiem wygłaszanych przeze mnie teorii na ten temat, zwłaszcza po drugiej butelce wytrawnego za 4,50. Niemniej jednak, to właśnie studia a zwłaszcza praca dyplomowa (mojej żony - przyp. autor), była ostatnio okazją dla mnie do podszlifowania Java-scriptu. Nie będe ukrywał, że wciąż uczę się tego języka i jestem na poziomie, mniej więcej, 4-letniego dziecka, które już rozumie, że palców do kontaktu się nie wkłada, bo boli ale niestety nie jest na tyle doświadczone żeby przełożyć tę teorie na np. garnek z gotującą wodą. Nie musiałem czekać długo aby przekonać się jak irytujące może być przeświadczenie, że to "musi działać" ale niestety nie chcę...

Potrzebowałem komórek tabeli, żeby je posortować, więc wziąłem je sobie, jak pan bóg przykazał:

(...)
table = getElement(table);
this.thead = table.getElementsByTagName('thead')[0];

new cols = this.getElementsByTagName('th');


Ale, że nie były mi potrzebne wszystkie, bo niezwykle trudno się sortuje np. po checkboksach, napisałem sobie pętle która, w teorii, miała wywalać mi niepotrzebne nagłówki tabeli.

for (var i = 0; i < cols.length; i++) {
if(cols[i].className != 'foo') {cols.splice(i,1)}
}
 


Problem w tym, że FireBug uparcie zwracał mi, że splice() nie jest funkcją, więc coś ewidentnie było nie tak... Ale, no... jak nie tak? Tablica? Tablica. Ma metodę splice()? No wg. dokumentacji ma. Więc czemu nie działa? Ano właśnie... bo "cols" to wcale *nie jest* tablica wink

Java-script jest, z jednej strony, bardzo elastyczny - pozwala na prawie dowolne definiowanie zmiennych, wywoływanie funkcji czy tworzenie obiektów, tak aby każdy, niezależnie od swojego *natywnego* języka, mógł w szybki sposób odnaleźć się w nowym środowisku, a z drugiej strony - owe środowisko implikuje pewne niejednoznaczności.

Otóż w Java-scripcie mamy 3 rodzaje tablic. A właściwie jeden - obiekt Array i dwa twory tablico-podobne, arguments i nodeList. Elementy te są zbliżone do siebie pod względem budowy, jednak sposób ich zachowania jest całkowicie różny. Zrozumienie tych różnić jest kluczem do... zaoszczędzenia czasu.

Jak to wygląda w praktyce?

Array - tablica nieskojarzeniowa, typ danych przechowujący ponumerowane *dowolne* wartości. Teoria mówi wszystko. Dodatkowo możemy operować na niej (dodawać/usuwać elementy, zmieniać ich kolejność oraz rozmiar całego obiektu) korzystając z metod reverse(), sort(), concat(), slice(), splice() czy symulować stos - push(), pop(). Elementy tablic są numerowane, poczynając od 0 (zero) tak więc chcąc odwołać się do 3 elementu tablicy "files" zrobimy to np. tak var foo = files[2]. Wszystko.

nodeList, czyli to, co pomyliłem z Array - nodeList jest listą elementów HTML generowaną, dynamicznie na podstawie drzewa DOM. Dodatkowo przeznaczona jest *tylko do odczytu*, co oznacza, że nie możemy dodawać bądź usuwać z niej żadnych obiektów korzystając np. z metody splice(). Rzeczą wspólną z obiektem Array jest właściwość .length zwracająca rozmiar tej pseudo-tablicy, tj. ilośc elementów, które zawiera. Sposób odwołania się do obiektów wewnątrz jest również taki sam, jak w przypadku tablic, czyli np. document.getElementsByTagName('div')[0].

arguments - Dla zasady warto o nim wspomnieć - każda funkcja posiada specjalny obiekt arguments. Jest to po prostu zbiór wszystkich argumentów, które funkcja przyjmuje. Nie można ich zmieniać, dodawać, usuwać czy sortować... chyba, że skopiujemy je do normalnej tablicy. Należy też pamiętać, że wszystkie wartości przekazywane przez argumenty stają się elementami obiektu arguments niezależnie czy argumentom zostały nadane nazwy w deklaracji funkcji. Podobnie jak pozostałe, obiekt ten posiada właściwość .length, która zwraca ilość elementów, które zawiera pseudo-tablica arguments.

Tyle. Mam nadzieje, że, jak zwykle, komuś to pomoże... a w ostateczności, zaoszczędzi trochę czasu.



GG na Maku Do następnego!

Comments

Unregistered user Saturday, November 24, 2007 10:56:25 AM

Piotr Lewandowski writes: Przerzuć się chłopie na coś, co da się zrozumieć... Polecam jQuery - sam używam... www: jquery.com

Piotrarti040 Saturday, November 24, 2007 12:22:46 PM

@Piotr

Z natury jestem perfekcjonista. Idac takim tokiem myslenia (jquery), dzis uzywalbym nie Vima a dajmy na to, FrontPage'a czy innego Dreamweavera. Zamiast tego, po 6 latach intensywnego uczenia sie przeplatanego praca i innymi obowiazkami moge z czystym sumieniem powiedziec, ze *znam* HTML i CSS. I piszac - "znam" to nie jest to, co wiekszosc ludzi ma na mysli mowiac o html/css ("Html? Ble... tego da sie nauczyc w 2 dni!"). Do podobnego celu daze z Java-script... choc oczywiscie z braku czasu i z uwagi na goniace terminy czasami zdarzy mi sie uzyc jakiegos script.aculo.us czy innego wynalazku wink

Write a comment

New comments have been disabled for this post.