WEBVTT

00:00:01.304 --> 00:00:03.685
Kan du huske de tre trin
der skal til at lave en animation?

00:00:03.685 --> 00:00:06.589
Vi starter med at initialisere nogle variable
uden for <i>draw</i>-funktionen,

00:00:06.589 --> 00:00:08.405
og derefter bruger vi de
variable inde i <i>draw</i>-funktionen

00:00:08.405 --> 00:00:10.011
i vores tegnekode.

00:00:10.011 --> 00:00:12.039
Så vi har en variabel
for <i>x</i>-positionen,

00:00:12.039 --> 00:00:14.395
en for <i>y</i>-positionen,
en for bredden (ballWidth),

00:00:14.395 --> 00:00:16.011
og en for højden (ballHeight).

00:00:16.011 --> 00:00:17.723
Og så, i slutningen,

00:00:17.723 --> 00:00:20.025
ændrer vi disse variable
en lille smule hver gang,

00:00:20.025 --> 00:00:22.773
så <i>x</i> kommer til at blive
den gamle værdi af <i>x</i> plus 1,

00:00:22.773 --> 00:00:24.701
så den kommer til at stige hver gang:

00:00:24.701 --> 00:00:27.796
<i>y</i> kommer til at blive
den gamle værdi af <i>y</i> minus 2,

00:00:27.796 --> 00:00:29.801
så <i>y</i> vil blive mindre hver gang;

00:00:29.801 --> 00:00:35.406
ballWidth sættes til den gamle værdi
af ballWidth gange med 0,99.

00:00:35.410 --> 00:00:39.409
Så forbi 0,99 er mindre end 1,
vil vi se at ballWidth bliver mindre.

00:00:39.409 --> 00:00:41.839
Og ballHeight sættes til 
den gamle værdi af ballHeight,

00:00:41.839 --> 00:00:45.501
divideret med 1,01, som er større end 1,

00:00:45.501 --> 00:00:47.963
og derfor vil ballHeight 
også blive mindre.

00:00:47.963 --> 00:00:50.234
Hvis vi trykker <i>Restart</i>, kan du se

00:00:50.234 --> 00:00:53.585
alle disse egenskaber
for bolden ændrer sig.

00:00:53.725 --> 00:00:56.607
Så hvis du ser disse fire linjer kode,

00:00:56.607 --> 00:00:59.251
du vil opdage at de alle
følger samme mønster,

00:00:59.251 --> 00:01:01.400
Vi har en variabel,
derefter et lighedstegn,

00:01:01.400 --> 00:01:06.047
derefter samme variabel, en operator --
plus, minus, gange, divere --

00:01:06.527 --> 00:01:08.593
og nogle tal, okay?

00:01:08.593 --> 00:01:11.772
Og dette mønster er så almindeligt
i programmering,

00:01:11.772 --> 00:01:14.460
og programmører er så dovne
at de har besluttet,

00:01:14.460 --> 00:01:16.777
"Hey! Når vi nu gør det her så ofte,

00:01:16.777 --> 00:01:19.054
"Kan vi ikke finde en kortere
måde at skrive det?"

00:01:19.054 --> 00:01:22.006
Og så lavede den en genvej,
og genvejen er:

00:01:22.006 --> 00:01:24.528
I stedet for at sige "x sættes til x plus 1",

00:01:24.528 --> 00:01:29.331
Jeg kunne sige "x plus ligmed 1."
Fik du det?

00:01:29.331 --> 00:01:35.970
Og i stedet for at sige <i>y</i> minus 2,
jeg kunne sige "y minus lig med 2."

00:01:36.670 --> 00:01:41.259
Og i stedet for at sige 
ballWidth sættes til ballWidth gange med 0,99

00:01:41.259 --> 00:01:47.686
Jeg kan sige -- du gættede det --
"<i>ballWidth gange lighed 0,99</i>"

00:01:48.203 --> 00:01:49.832
Endelig, i stedet for at sige at

00:01:49.832 --> 00:01:53.658
ballHeight sættes til ballHeight divideret med 1,01

00:01:53.658 --> 00:01:57.373
kan vi sige
"ballHeight divideret ligmed 1,01."

00:01:57.373 --> 00:01:59.468
Så for alle disse,

00:01:59.468 --> 00:02:01.553
tager den værdien af variablen,

00:02:01.553 --> 00:02:04.123
her ballWidth, og derefter denne operator,

00:02:04.123 --> 00:02:06.344
og så ganges det med 0,99.

00:02:06.344 --> 00:02:09.240
Så det bliver,
"<i>ballWidth gange 0,99</i>"

00:02:09.240 --> 00:02:12.067
og gem det tilbage
i variablen, ballWidth.

00:02:12.067 --> 00:02:13.864
Og hvis jeg trykker <i>Restart</i> kan du se

00:02:13.864 --> 00:02:16.005
at vores animation ser ud som før.

00:02:16.005 --> 00:02:17.975
Nu kan er din tur til at være doven!