Villkor i koden
Det är med villkor koden blir riktigt intressant och användbar!
Om användaren klickar eller matar in en siffra kan olika händelser ske i programmet. Villkor görs ofta med IF och ett villkor i parentesen.
Om villkoret är sant utförs det som står mellan klammerparenteserna.
if(villkor)
{
// händelser som utförs om villkoret är sant
}
Här är ett exempel:
Om du har touchskärm så bör du skriva koden i p5 editorn själv för att se resultatet. Den editor som finns inbäddad här nedan fungerar inte med touchskärm i alla lägen.
Ibland är det smidigt att kunna utföra något om villkoret stämmer och något annat om det inte stämmer. Då är ANNARS (på engelska: else) bra.
if(villkor){
// händelser som utförs om villkoret är sant
}else{
// annan händelse som utförs om villkoret inte är sant
}
Gör om exemplet ovan så att det står “Det händer inget!” när ingen klickar.
Ibland kan du vilja sätta upp ett villkor för vad som ska hända efter “else”, dvs ANNARS OM (else if). Så här kan det beskrivas:
if(villkor){
// händelser som utförs om villkoret är sant
}else if( villkor){
// annan händelse som utförs om det första villkoret inte är sant,
// men detta villkor är sant
}else{
// annan händelse som utförs om inget av villkoren inte är sant
}
Nu får du en utmaning att skapa ett program som jämför siffror. För att göra det behöver du få veta lite om jämförelseoperatorer:
Här är exempel på villkor med jämförelser:
if(a > b) if(a <= c) if(namn == "Lillian")
Var alltså noga med att aldrig använda ETT ensamt = i en jämförelse! Du måste använda två == eller tre === för att jämföra, annars läggs det högra värdet i den vänstra variabeln (och då blir det alltid sant!)
Tre === används t ex för att vara säker på att det är en siffra (t ex 5), och inte en textsträng (t ex “5”).
I utmaningen ska du på editor.p5js.org skriva om koden nedan så att den ger följande resultat:
- Om svaret är mindre än eller lika med 10 visas texten “Lite!”
- Annars, om svaret är mindre än 50, visas “Halvmycket…”
- Annars, om svaret är precis 100, visas “Wow, maxat!”
- Annars visas “Mycket!”
let svaret;
function setup() {
createCanvas(380, 200);
background(255);
textSize(30);
svaret = prompt('Skriv en siffra mellan 0-100');
}
function draw() {
text('Lite!',100,100);
}
Vad händer om du använder === i jämförelsen om svaret är 100 istället för två eller ett =? (Prova med olika svar) Och varför?