Teraz pomoże nam
mój przyjaciel Winston.

Już wygląda obłędnie,

ale zmienię wielkość jego oczu.

Tutaj rysuję oczy.

Biorę kolor i rysuję dwie elipsy.

Jeśli chcę, żeby ta była mniejsza,

zmienię szerokość i wysokość
o tyle samo.

Chcę oczy takiej samej wielkości.
Zmieńmy parametry drugiej elipsy.

Teraz są za małe, zmienię z powrotem.

A gdybym zmodyfikowała jedną liczbę
i zmieniłoby się oboje oczu?

Do tego przydają się zmienne.

„Zmienna” to jedna nazwa
różnych rzeczy.

Wyobrażam sobie zmienną
jako wiadro z nazwą.

Można tam włożyć,
co się chce, a nazwa zostaje.

To, co jest w wiadrze,
nazywamy wartością zmiennej.

Najpierw określmy zmienną.
Zrobię to tutaj.

Wystarczy wpisać „var”
(variable - zmienna),

spację i nazwę zmiennej,
opisującą, czego zmienna dotyczy.

Dam „eyeSize” - wielkość oka.
Nazwa może być dowolna,

byle bez spacji między słowami.

Pamiętajcie o średniku!

Zrobiłam zmienną „eyeSize”,

która dotyczy
rozmiaru oczu Winstona.

Na razie nie ma wartości.

Aby ją przypisać,
wklepujemy „eyeSize”,

potem znak równości i 20.

Średnik.

Widzicie znak równości?

Zapomnijcie o matematyce!

Tu znak nie oznacza równości,
tylko przypisanie.

Przypisujemy wartość „20”
zmiennej „eyeSize”.

Inaczej: wkładamy liczbę 20
do wiadra o nazwie „eyeSize”.

Na lekcjach matematyki mówicie:

x = 3 oraz 3 = x,
co oznacza jedno i to samo?

Tutaj - nie.

Po lewej stronie znaku równości
zawsze jest zmienna.

A po prawej stronie znaku
zawsze widnieje wartość,

którą tej zmiennej przypisujecie.

Jak zapamiętać, co jest gdzie?

Gadając do siebie,
jak każdy fajny programista,

przy znaku równości nie mówcie
„równa się”, tylko „dostaje”.

Mamy wtedy: „eyeSize” dostaje „20”.

Gdy będę używać „eyeSize” w swoim
programie, komputer powie:

„To zmienna, a tak naprawdę
chodzi o tę wartość: 20”.

Patrzcie: skopiuję to

i zastąpię cztery liczby

nową zmienną „eyeSize”.

Gotowe! Winston ma okrągłe oczy
tej samej wielkości.

Gdybym chciała zmienić wartość,
czyli wielkość obojga oczu,

wystarczyłoby zmodyfikować
wartość tej zmiennej.

Super!

Jeszcze parę uwag.

Zrobiliśmy nową zmienną „eyeSize”.

Przypisaliśmy jej wartość 33.

Możemy to zrobić szybciej.

Napiszmy: „var eyeSize”
(to pierwszy krok)

dostaje „33” (to krok drugi).

Jeśli skasuję te wiersze,
wszystko będzie dalej działać.

Pamiętajcie: komputer
czyta program od góry do dołu.

Wiedział, czym jest „eyeSize” tu,

bo zdefiniowaliśmy to wcześniej.

Gdybym napisała to tutaj,

to komputer, dochodząc
do tego wiersza, dziwiłby się:

„Co to jest eyeSize? Nie znam!”.

Informuje o tym
poprzez komunikat o błędzie.

Może myślicie:
„Tak, zdefiniowałem to, tutaj!”.

Komputer nie jest mądry,
nie rozumie.

Przenieśmy to na górę.

Zanim użyjecie zmiennej,
sprawdźcie, czy ją zdefiniowaliście.

Znacie już zmienne! Gratulacje!