@kun87:
@Patryk27:
@piternet:
Z podanym i zaakceptowanym jako rozwiązanie kodem jest niestety dużo więcej problemów niż tylko bezsensownie, myląco użyte znaki $.
Sugeruję autorowi rozważenie następujących kwestii:
- Tradycyjnie, jeśli już używamy w JavaScripcie jQuery, to owszem, niektórym zmiennym nadajemy nazwy rozpoczynające się od $, ale dotyczy to tylko zmiennych będących obiektami (kolekcjami) jQuery:
Czyli:
var $mojDiv = $("div#moj"); // OK -- kolekcja jQuery
var $mojLink = $mojDiv.find("a"); // OK -- kolekcja jQuery
var mojDiv - $mojDiv[0]; // OK -- element DOM, a nie kolekcja jQuery
var liczba = 4; // OK -- liczba, a nie kolekcja jQuery
var $liczba = 4; // ŹLE!!! to liczba, a nie kolekcja jQuery -- powinno być bez $
var $jakisLink = $mojLink[0]; // ŹLE!!! to element DOM, a nie kolekcja jQuery -- powinno być bez $
To jest słuszny argument za używaniem lub nie używaniem $. Nie chodzi aż tak bardzo o pisanie kolejnego znaku, a jeśli już to o szum, jaki ten znak powoduje przy CZYTANIU kodu, a nie czas, jakiego wymaga przy PISANIU kodu. Programiści zdecydowaną większość czasu spędzają na czytaniu i debugowaniu kodu, a nie pisaniu. Jeden znak w tę czy w tamtą podczas pisania ma marginalne znaczenie.
W rozwiązaniu znak dolara trafił wszędzie. Również do zmiennych skalarnych, tj. przechowujących liczby. Jest to mylące i błędne. Samego dolara nie dodajemy w JS-ie "bo można" czy "bo jest fajny". To, że można coś zrobić czy że NAM coś się wydaje fajne nie ma żadnego znaczenia. Profesjonalista nie tworzy kodu w ten sposób.
Kod ma być maksymalnie czytelny i zrozumiały. Wszystko inne, wszystkie dodatkowe szlaczki w zmiennych, to szum. Można np. poprzedzać wszystkie składowe prywatne klasy znakiem podkreślenia (_), bo ten znak może zwiększyć zrozumiałość kodu: oznacza, że używamy właśnie składowej (pseudo)klasy. W normalnych językach programowania nie trzeba używać tego znaku, bo IDE podświetla składowe na inny kolor. Dynamika JS-a (i bezklasowość) nie pozwala na łatwą implementację takiego podświetlania, więc możemy stosować podkreślniki. Albo dolary. Albo cokolwiek. Ale nie możemy dawać podkreślnika do każdej jednej zmiennej, "bo tak". To by była już nadmiarowość, głupota.
z kodu rozwiązania należy usunąć dolary z nazw zmiennych skalarnych.
- To być może wynika z powyższego, ale autor nagminnie używa niepotrzebnie funkcji $() na czymś, co jest już wynikiem działania funkcji $.
Mamy na przykład (oznaczmy to gwiazdką):
$($lewy_element) // (*)
Podczas gdy $lewy_element
zdefiniowaliśmy jako:
Po podstawieniu prawej strony równości w miejsce oznaczone (*), mamy jakby:
$($('.lewa')) // (*)
Czyli zbędne, dwukrotne owinięcie w funkcję $(). Należy usunąć to drugie wywołanie $. Jest nadmiarowe i tylko spowalnia, zaśmieca i zaciemnia kod.
M.in. po to dodaje się tradycyjnie znaczek $ do zmiennych z kolekcjami jQuery, by drugi raz nie wywoływać na nich funkcji $(). Ponieważ autor jednak dodaje na wiwat ten znak dolara wszędzie gdzie się da, może nie zauważyć tego, co byłoby oczywiste gdyby trzymał się konwencji (którą, jak widać, całkiem sensownie wymyślono).
- Kod cierpni na zmorę powtórzeń, łamiąc zasadę DRY ( http://en.wikipedia.org/wiki/DRY ). Jest też mało uniwersalny: po dodaniu trzeciej czy czwartej kolumny trzeba by go mocno zmodyfikować, dodając kolejne IF-y i zmienne.
Można go przepisać tak:
$(document).ready(function() {
var $kolumny = $(".lewa, .prawa");
var wysokoscNajwyzszejKolumny = 0;
$kolumny
.each(function() {
var wysokoscTejKolumny = $(this).height();
if (wysokoscTejKolumny > wysokoscNajwyzszejKolumny) {
wysokoscNajwyzszejKolumny = wysokoscTejKolumny;
}
})
.css("height", wysokoscNajwyzszejKolumny);
;
});
To tak najprościej, łopatologicznie. Da się krócej:
$(document).ready(function() {
var $kolumny = $(".lewa, .prawa");
var wysokoscNajwyzszejKolumny = 0;
$kolumny
.each(function() {
wysokoscNajwyzszejKolumny = Math.max($(this).height(), wysokoscNajwyzszejKolumny);
})
.css("height", wysokoscNajwyzszejKolumny);
;
});
Da się to oczywiście skrócić, np. korzystając z funkcyjności, ale wtedy z czytelnością już gorzej, nawet przy zachowaniu zmiennej pomocniczej wysokosci
:
$(document).ready(function() {
var $kolumny = $(".lewa, .prawa");
var wysokosci = $.map($.makeArray($kolumny), function(kolumna) { return $(kolumna).height() });
$kolumny.css("height", Math.max.apply(Math, wysokosci));
});
Tak czy siak, ten -- krótszy -- kod jest znacznie bardziej elastyczny. Żeby dodać kolejne kolumny, wystarczy zmienić selektor przy deklaracji zmiennej $kolumny
. Trywialnie można by całość zamknąć w funkcji.