Macierze obiektów (wersja wideo)

To tylko zapis naszych interaktywnych sesji poświęconych kodowaniu, stworzony by ułatwić ich przełożenie na inne języki. Polecamy obejrzenie tych sesji bezpośrednio pod adresem: https://pl.khanacademy.org/cs/programming/

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!