Variable Expressions (Video Version)

Vi er tilbage sammen med Winston,

og nu har vi både
en x og en y variabel

til at angive Winstons position.

Så nu kan vi få Winston
til at hoppe op og ned

og have en lille Winston fest!
Wooo!

Rigtig sjovt!

Lad os gennemgå koden igen,
inden vi fortsætter.

Vi har de to x og y variable
i toppen,

der gemmer centerpositionen
for Winstons ansigt.

Dem bruger vi på den her linje,
når vi laver ellipsen for hans ansigt.

Derefter placerer vi øjnene
og munden

relativt til centrum af ansigtet.

Vi trækker fra eller lægger til
x og y for at sørge for at øjnene

er 50 pixels væk og 100 pixels væk.

For eksempel, så er munden

50 pixels til højre for
centrum af hans ansigt,

og 40 pixels under
centrum af hans ansigt.

Lad os gå videre og se hvad
vi ellers kan gemme som variable.

For at gøre det, vil jeg gå igennem
hver linje af kode

og se efter det vi kalder
tal der er "hard coded".

De er talværdier der
står skrevet som tal,

ikke variable
eller afhængige af variable.

Lad os se.
I vores første ellipse() kald her,

der har vi 300 og 300 for bredden og højden.

I stedet kan vi lave en variabel
for dem, f.eks. faceSize.

Vi skriver, faceSize = 300,
og så kan vi give faceSize videre her,

og lige nu, vil den give 300
som værdien.

Sejt. Lad os fortsætte.

Alt her bruger
x eller y eller eyeSize

men her, ved munden,
bruger vi igen 150

og 150 som bredden og højden.

Så vi kan lave en mouthSize variabel,
f.eks. mouthSize = 150,

og så går vi ind og skriver mouthSize her.

Så nu sender den 150 ind,

for det er hvad variablen
er lig med.

OK, så nu hvor vi har gjort det,
kan vi nemt ændre på faceSize her,

og vi kan nemt ændre på mundens størrelse,
og vi kan flytte den sådan her,

og vi kan ændre på eyeSize igen.

OK, fedt nok.

Men der er noget
jeg ikke rigtig kan lide ved det,

og det er at når jeg ændrer
faceSize.

Så vil jeg faktisk gerne have
alt andet til ændre relativt til faceSize.

så hvis jeg laver faceSize
rigtig lille, sådan her,

vil jeg have hans øjne og mund
til også at blive rigtig små.

Hvis jeg laver faceSize halvt så stor
som dens oprindelige størrelse,

skal øjnene og munden altså
også blive halvt så store.

Ellers, så ser han rigtig fjollet ud,

fordi hans øjne og mund er alt
for store til hans ansigt.

De er ikke engang forbundet længere.

Så hvad vi gerne vil have,
er at få variablene

mouthSize og eyeSize,

til at afhænge af variablen
faceSize.

Så, lad få tilbage hvad det var.

Måden vi kan gøre det her,

er at vi kan få værdierne
til at basere sig på faceSize's værdier.

Så vi kan sige
mouthSize = faceSize/2.

Vi bruger en brøk af ansigtet.

Vi siger altså, tag halvdelen
af ansigtsstørrelsen.

Hvis du ikke er bekendt med brøker,

så er der tons vis af videoer på Khan Academy

som du kan bruge til at lære
hvordan brøker fungerer.

All right. Nu videre til eyeSize. Det er omkring
faceSize/4.

Det er ikke perfekt,
men det er ret godt.

Åh, 7.
Sådan der, det var bedre.

Se, hvis du får brøken forkert
i starten,

så kan du altid rette det senere.

Bare fifl lidt med tallet
ind til det giver mening.

OK, så nu skal vi ændre størrelsen på ansigtet igen,

se hvordan øjne og mund rent faktisk
skifter størrelse sammen med den?

Det er ret sejt.

Men der er stadig noget galt.

Øjnene og munden

ryger uden for ansigtet
når vi gør det rigtig småt.

Størrelserne er rigtige;
problemet er forskydningen fra ansigtet.

Det der sker her
er det hernede,

når vi placerer ellipser,

vi har x - 50 og y - 50,
og derefter x + 100 og y - 60,

Så selv om vores ansigt
kun er 50 pixels,

skal vi stadig have placeret øjnene
-50 pixels fra centrum,

hvilket der får det til at være
uden for ansigtet.

Så, vi har brug for at ændre 50 og 100
og alle de tal her

så de alle er brøker af faceSize

så når faceSize ændres,
så vil afstanden øjnene er forskudt

og munden er forskudt,

også skulle ændre sig.

Så for at vise hvad jeg mener,
lad os prøve med øjnene først.

x - 50, Så, x - 50 pixels.

Det betyder at det skal være 50 pixels
til venstre for centrum af ansigtet.

Okay, det vi egentlig vil nu
er at bruge brøken

så det bliver faceSize/6.

Så, en sjettedel af ansigtsstørrelsen.

Sejt. Og så 50 vil også være faceSize/6.

Så, når vi nu ændrer størrelsen,

så hold øje med hvordan øjet
er perfekt placeret.

Godt øjnet, Winston! Godt øjnet!

Det andet øje har stadig
brug for lidt hjælp.

Så 100; det bliver faceSize/3,
så en tredjedel af ansigtsstørrelsen.

og 60 er en femtedel af ansigtsstørrelsen,
så faceSize/5.

Godt. Lad os afprøve det, rigtig godt.

Vi har stadig et problem med munden.

så vi går ned til munden.

Den bliver måske faceSize/6 igen,

og den her er måske faceSize/7.

Okay, nu er alt proportionalt.
Lad os se hvordan det virker.

Woo! Nu kan vi gøre Winston rigtig lille,

og hans øjne og mund
er stadig inde i ansigtet!

Jeg er sikker på Winston
er rigtig glad for det.

Sådan, juhuu!

Lad se lidt tilbage på hvad vi har gjort.

I toppen har vi vores variable.

Vi starter med en variabel
der bare indeholder et tal: 200.

Derefter laver vi vores mouthSize
og eyeSize variabler

så de afhænger af tallet,
som brøker af det tal,

sådan at hvis faceSize er 200,

så er mouthSize 100.

Men hvis vi ændrer faceSize til 300,

så vil mouthSize
pludselig blive 150,

så det ændrer sig altid proportionalt.

Og hernede,
hvor vi beregner forskydningerne,

bruger vi også brøker,

fordi vi gerne vil have forskydningerne
til at ændre sig

proportionalt til ansigtsstørrelsen.

Vi vil basalt set gerne gøre sådan

at vi har den her ene variabel
der påvirker alt det andet.

Det kan vi gøre med variable
og udtryk med variable.

Så, nu hvor vi forstår

hvordan man laver variable
afhængige af værdien af andre variable,

kan vi gøre meget mere med vores programmer.

Lad os fejre det
ved at gøre Winston kæmpe stor!

Go Winston, kom så,
ja fortsæt! Sådan!

Du må ikke stoppe!!
Ja fortsæt! Weee!