Dowiadujmy się dalej, co można zrobić z obiektami.
Sięgnijmy do programu z filmiku o funkcjach.
Ma on funkcję „drawWinston”,
która umie narysować Winstona w danym „x” i „y”...
Tutaj przywołujemy tę funkcję cztery razy,
zawsze z innymi współrzędnymi.
Znacie mnie. Gdy patrzę na te cztery rysunki Winstona,
tak podobne do siebie,
myślę tylko, że dużo lepiej byłoby użyć pętli.
I przywołać funkcję raz, wewnątrz pętli,
zmieniając „x” i „y” w każdym powtórzeniu pętli.
W tym celu musimy znaleźć sposób na przechowywanie pozycji „x” i „y”,
w tablicy, żebyśmy mieli do nich dostep.
Mamy dwa zestawy wartości,
więc moglibyśmy zrobić dwie tablice.
Jedną dla pozycji „x”, drugą dla pozycji „y”.
Dajmy pozycje „x”: 99, 294, 101 i 294...
a pozycje „y” to 117, 117, 316, 316.
Teraz możemy zrobić tu pętlę,
pisząc: for-loop var i = 0;
i < xPositions.length; i++
Przejdziemy przez każdy element „xPositions”,
i napiszemy: drawWinston(xPositions[i],
yPositions[i]);
Sprawdźmy, czy to działa. Skasujmy...
Udało się!
Możemy to przywołać.
Jedna linijka programu rysuje Winstona
w każdej pozycji z tablicy „xPositions”.
Możemy dodawać więcej. Powiedzmy od 10.
Potem dodajemy 1, i 1, i 1...
a później 100, i 1...
Zrobił się tu bałagan.
Niedobrze, bo trudno mi zobaczyć,
który „x” odnosi się do którego „y”.
A ja chcę na pierwszy rzut oka widzieć
pary x-y, zamiast pilnować,
żeby były idealnie ustawione w pionie, np. tak.
Chcę znaleźć inny sposób przechowywania tych pozycji.
Możemy przechowywać je jako obiekty.
Każda pozycja to dwie informacje: „x” i „y”.
Możemy zrobić obiekt o właściwościach „x” i „y.”
Możemy mieć tablice obiektów z pozycjami „x” i „y”.
Zróbmy to więc.
Napiszemy: „var positions”
równa się... i to też będzie tablica.
Ale każdy element, zamiast być liczbą, będzie obiektem.
Mamy klamry...
I napiszemy „x:99” i „y:117”.
Mamy tu jedną z naszych pozycji,
a drugą dodamy tutaj.
Dobrze; „x” wyniesie 294, 117,
dalej 101,
dalej 316,
a na koniec 294 i 316.
I jest tablica obiektów,
z których każdy ma właściwości „x” i „y”.
Teraz za pomocą pętli FOR
wypiszemy każdy obiekt tablicy „positions”.
Następnie przekażemy obiekt.
Na razie przekazujemy cały obiekt, a chcemy przekazać wartości „x” i „y”.
Potrzebujemy zatem positions[i].X i positions[i].Y.
Hura!
Możemy skasować te stare, zaśmiecone tablice.
Teraz wygląda to znacznie ładniej,
a program jest prostszy do czytania. Im łatwiej, tym lepiej!
I łatwiej jest dodawać nowe obiekty. Jeśli chcę dodać 1...
Dodam tę parę.
Powiedzmy, że „x” to 200, „y” też...
i pośrodku pojawi się Winston.
Fajnie!
A teraz pokażę wam coś jeszcze lepszego.
Zauważcie, że nasza funkcja przyjmuje dwie liczby
i korzysta z nich.
Możemy zmienić funkcję tak, że będzie oczekiwać obiektu
i weźmie z niego „x” oraz „y”.
To znaczy, że możemy zabrać stąd obiekt.
Spróbujmy.
Zabieramy obiekt, teraz nie działa.
Bo nasza funkcja oczekuje dwóch obiektów,
a dostaje tylko jeden. Zmienimy to więc.
Damy tu „facePosition”,
ale widać komunikat o błędzie, bo FaceX nie jest zdefiniowane.
Wcześniej „faceX” było argumentem,
lecz teraz nie istnieje. Mamy tylko obiekt.
Możemy zapisać pozycję „x”
z obiektu wewnątrz zmiennej „faceX”.
Mamy więc obiekt,
wiemy, że ma właściwość „x”,
i będziemy go przechowywać w zmiennej „faceX”.
To samo możemy zrobić z „y”: „faceY = facePosition.y”.
I proszę! A reszta funkcji używa „faceX” i „faceY”.
Trzeba to dobrze zapisać. „xx” nie zadziała,
bo tego nie ma tutaj, w naszej tablicy obiektów.
Musi pasować!
Wspaniale: teraz możecie mieć tablice obiektów,
funkcje przyjmujące obiekty,
i przekonacie się, że programy są świetne
w organizacji danych.
Zwłaszcza że często chcemy łączyć „x” z „y”.
Tablice obiektów przydadzą się podczas rysowania i animacji.
Korzystajcie z nich i bawcie się dobrze!