Return to Video

Modyfikowanie macierzy (wersja wideo)

  • 0:01 - 0:04
    Wiecie już, jak stworzyć tablicę
    i dostać się do niej.
  • 0:05 - 0:06
    Tak jak pozostałe zmienne,
  • 0:06 - 0:09
    tablice mają świetną cechę:
  • 0:09 - 0:11
    możemy je zmieniać dynamicznie
  • 0:11 - 0:13
    w trakcie działania programu.
  • 0:13 - 0:15
    Pokażę, o co mi chodzi.
  • 0:15 - 0:21
    Ten program wyświetla
    Hopper z balonikami. Ślicznie!
  • 0:21 - 0:25
    Mamy tablicę pozycji „x”,
  • 0:25 - 0:27
    zawierającą dwie liczby,
  • 0:27 - 0:30
    które pokazują,
    gdzie mają być baloniki.
  • 0:30 - 0:32
    A tutaj mamy pętlę
  • 0:32 - 0:35
    przechodzącą przez każdy
    element w tej tablicy.
  • 0:36 - 0:40
    Dla każdego elementu, pętla rysuje
    kreskę od „x” do ręki Hopper,
  • 0:40 - 0:44
    a potem w pozycji „x”
    rysuje elipsę
  • 0:44 - 0:47
    o wymiarach 30 na 40 pikseli.
    Nasz balonik.
  • 0:48 - 0:49
    Fajnie!
  • 0:49 - 0:51
    Już wiemy, jak to działa.
  • 0:51 - 0:54
    Chcąc wyświetlić kolejny balonik,
  • 0:54 - 0:57
    dodamy liczbę do tablicy.
  • 0:57 - 0:59
    Np. - 300.
  • 0:59 - 1:02
    Pięknie! Teraz mamy trzy baloniki,
    a Hopper się cieszy.
  • 1:03 - 1:07
    Ale powiedzmy, że chcemy
    nauczyć użytkownika,
  • 1:07 - 1:08
    który nie programuje,
  • 1:09 - 1:11
    jak dodawać nowe baloniki.
  • 1:11 - 1:14
    Program powinien
    mówić użytkownikowi:
  • 1:14 - 1:18
    „Kliknij tam, gdzie chcesz balonik,
    a on się pokaże”.
  • 1:18 - 1:21
    Byłoby świetnie, prawda? Tak sądzę.
  • 1:21 - 1:24
    A zatem... jak to zrobić?
  • 1:24 - 1:26
    Chcemy, by program
    zmieniał się w czasie.
  • 1:27 - 1:28
    Gdy użytkownik kliknie,
  • 1:28 - 1:30
    w tym miejscu pokaże się balonik.
  • 1:31 - 1:35
    Najpierw włóżmy wszystko
    w funkcję „draw”,
  • 1:35 - 1:38
    żeby ułatwić zmiany.
  • 1:38 - 1:40
    Zacznijmy tutaj.
  • 1:41 - 1:43
    I jeszcze to... Świetnie!
  • 1:43 - 1:48
    Teraz sprawdzimy, czy użytkownik
    właśnie wciska przycisk myszki.
  • 1:48 - 1:50
    Przyda się instrukcja warunkowa.
  • 1:50 - 1:53
    Jeśli przycisk jest wciśnięty,
  • 1:54 - 1:57
    to program musi coś zrobić. Co?
  • 1:57 - 2:01
    Po wciśnięciu przycisku
    niech program dodaje coś do tablicy.
  • 2:02 - 2:04
    Zróbmy z powrotem dwa elementy.
  • 2:04 - 2:08
    Chcemy dodać liczbę do tablicy.
  • 2:08 - 2:11
    Pokażę wam jeden sposób.
  • 2:11 - 2:13
    Piszemy: xPositions...
  • 2:13 - 2:15
    nawias kwadratowy, dwójka...
  • 2:16 - 2:18
    = mouseX.
  • 2:18 - 2:21
    Zaraz zobaczycie, że to działa.
  • 2:22 - 2:25
    Kliknęłam i pokazał się balonik.
  • 2:25 - 2:27
    Co zrobił program? Powiedział...
  • 2:29 - 2:30
    xPositions[2] mówi:
  • 2:30 - 2:34
    „Znajdź tablicę
    i element z numerem 2”.
  • 2:34 - 2:38
    Pamiętajcie, że to trzeci element,
    bo tablica zaczyna się od 0.
  • 2:39 - 2:42
    Ale trzeciego elementu nie ma.
    To miejsce jest puste.
  • 2:42 - 2:46
    Program mówi: „Znajdź miejsce
    i ustaw mouseX”.
  • 2:46 - 2:48
    Ponieważ nie ma tam nic,
  • 2:48 - 2:51
    po prostu pojawia się
    „mouseX”.
  • 2:51 - 2:54
    Teraz tablica ma trzy elementy.
  • 2:55 - 3:00
    A pętla FOR, przechodząc tędy,
    narysuje trzeci balonik.
  • 3:00 - 3:04
    Super! Poklikam jeszcze,
    zobaczycie, jak to działa.
  • 3:04 - 3:06
    Za każdym razem, gdy klikam,
  • 3:06 - 3:09
    pojawia się trzeci balonik.
  • 3:09 - 3:10
    Tam, gdzie kliknę myszką.
  • 3:11 - 3:14
    To dlatego, że ciągle zmieniamy...
  • 3:15 - 3:19
    miejsce drugie. Z numerem 2.
  • 3:19 - 3:23
    Ciągle to zmieniamy,
    podając bieżącą pozycję mouseX.
  • 3:23 - 3:26
    Zawsze będą tylko trzy baloniki,
  • 3:26 - 3:28
    ten w punkcie 0,
  • 3:28 - 3:31
    ten w punkcie 1...
    I stale zmieniamy...
  • 3:32 - 3:34
    punkt nr 2. W porządku?
  • 3:35 - 3:36
    To jest dobre,
  • 3:36 - 3:40
    ale chcemy, żeby użytkownik
    robił masę baloników!
  • 3:40 - 3:43
    Każde kliknięcie to nowy balonik.
  • 3:43 - 3:47
    Czyli musimy stale zwiększać
  • 3:47 - 3:51
    numer elementu tablicy,
    w którym to przechowujemy.
  • 3:51 - 3:55
    Nie zawsze ma być 2,
    tylko 2, 3, 4, 5, 6 itd.
  • 3:56 - 3:59
    Zrobimy to dzięki
    zmiennej liczącej.
  • 3:59 - 4:01
    Napiszemy „newInd=2”.
  • 4:01 - 4:02
    Od tego zaczniemy.
  • 4:03 - 4:06
    Tu napiszemy „newInd” zamiast „2”,
  • 4:06 - 4:09
    ale docelowo ma być „newInd++”.
  • 4:10 - 4:12
    Czyli za każdym razem dodajemy 1.
  • 4:12 - 4:13
    Zaczynamy od 2,
  • 4:14 - 4:17
    potem jest 3, 4...
    Za każdym kliknięciem - więcej.
  • 4:17 - 4:18
    Spróbujmy!
  • 4:18 - 4:20
    Hura! Mnóstwo baloników!
  • 4:20 - 4:22
    Balonikowe szaleństwo!
  • 4:22 - 4:24
    Fajnie, prawda?
  • 4:25 - 4:27
    Ale to nie jest najlepsza metoda.
  • 4:27 - 4:28
    Okazuje się,
  • 4:29 - 4:32
    że będziemy często
    dodawać elementy do tablicy.
  • 4:32 - 4:35
    Jest znacznie prostszy sposób.
  • 4:35 - 4:38
    Skasuję to, co napisaliśmy...
  • 4:38 - 4:41
    To już nie jest potrzebne.
  • 4:41 - 4:42
    Cofamy.
  • 4:42 - 4:45
    Robimy tak. Piszemy: „xPositions”,
  • 4:46 - 4:48
    potem kropka, „push”
  • 4:48 - 4:50
    i „mouseX”.
  • 4:51 - 4:56
    Przywołujemy tę metodę
    w tablicy „xPositions”.
  • 4:56 - 4:58
    Wydajemy polecenie.
  • 4:58 - 5:02
    Mówimy: „Wepchnij nową wartość,
  • 5:02 - 5:05
    czyli mouseX, na koniec tablicy“.
  • 5:05 - 5:09
    Przy każdym przywołaniu,
    czyli gdy ktoś klika myszką,
  • 5:09 - 5:12
    program spojrzy na „mouseX”
    i umieści to na końcu tablicy.
  • 5:13 - 5:15
    Tablica będzie się zatem powiększać.
  • 5:15 - 5:17
    Zacznijmy od nowa.
  • 5:18 - 5:22
    Udało się! A program jest krótszy
    niż przedtem!
  • 5:23 - 5:27
    Na ogół będziecie używać „push”,
    żeby dodać elementy do tablicy.
  • 5:28 - 5:32
    I świetnie: tablice rosną
    w czasie trwania programu.
  • 5:32 - 5:36
    Np. przy animacji, albo gdy użytkownik
    coś robi... Możliwości jest dużo.
  • 5:36 - 5:42
    Widzieliście 90% tego, do czego
    używa się tablic - i jak się to robi.
  • 5:42 - 5:44
    Ale to nie wszystko.
  • 5:44 - 5:47
    Jeśli macie pytania, zadawajcie je.
  • 5:47 - 5:50
    Tylko najpierw opanujcie podstawy!
Title:
Modyfikowanie macierzy (wersja wideo)
Description:

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/

more » « less
Video Language:
English
Duration:
05:51

Polish subtitles

Revisions