Javascript - Introduktion

Från Wikiskola
Version från den 24 maj 2016 kl. 22.54 av Hakan (diskussion | bidrag)
(skillnad) ← Äldre version | Nuvarande version (skillnad) | Nyare version → (skillnad)
Hoppa till navigering Hoppa till sök

Beskrivning av blockets innehåll

Vi lär oss grunderna i javascript på spelprogrammering.nu.

Uppgifter i javascriptavsnittet

  • Intro med Logo Turtle
  • En rörlig boll
  • Ett ritprogram att utveckla
  • Ett eget projekt

Mål för introt till javascript

Mål för undervisningen när du är klar med avsnittet kan du:

Göra enkla program genom att använda

  • metoder
  • loopar
  • villkorssatser
  • variabler

och du kan

  • återanvända andras kod
  • kommentera din kod
  • skriva strukturerade program
  • publicera dina exempel på spelprogrammering.nu
  • hämta hem en hemsida med ditt program


Bedömning - intro till javascript

Du blir bedömd på

  • ditt vidareutvecklade ritprogram
  • ditt egna projekt

Ladda upp det på klassens wordpress

Använd FileZilla
Logga in med användare javascript så hamnar du i mappen med samma namn
Döp din fil med ditt namn
Ladda upp filen
Kolla vad den har för adress och prova att du kan hitta den genom att skriva in adressen (URL:en) i din browser.
Tag den adressen och skapa en länk på din sida på Wordpressajten

Bedömningskriterier - intro till javascript

E: Du använder metoder, loopar, villkorssatser, variabler
C: Strukturerad kommenterad kod
A: Egna finesser eller utveckling



HowTo-filmer till spelprogrammering.nu

Micke Tylmad har gjort en fin serie videogenomgångar. De är väl värda att se.

Av Micke Tylmad, CC By

Exempel med if-sats och användning av variabler.

Intressant här är att vi ändra färg med en villkorssats och en variabel.

ball.y + 50, flyttar bollen nedåt från startläget.

<script src="http://spelprogrammering.nu/simple.js">
function start()
{
  ball = {x: 0, y: 0};
  color = "green";
}

function update()
{
  clearScreen();
  
  circle(ball.x, ball.y + 50, 30, color);
  ball.x++;
  
   if(ball.x>= 200){
   color = "blue";
  }
 
}
</script>