Ga naar de inhoud

p5js nl

Leer programmeren voor visual arts

Menu
  • Home
  • Unit 1
    • Unit 1, LA1
      • U1 LA1 1.1. Maak een Robot
      • U1 LA1 1.2 Lijn functies en parameters
      • U1 LA1 1.3 Teken een GSM
      • U1 LA1.4 Meerhoeken, sterren, bogen
      • U1 LA 1.5 Mini-project: Maak een Taijitu (Yin & Yang)
    • Unit 1, LA 2
      • U1 LA 2.1 Meebewegen met de muis
      • U1 LA2.2 Meekleuren met de muis op je eigen variabele
      • U1 LA 2.3 Random Ellipsen
      • U1 LA2 Mini-Project Custom Emoji
    • Unit 1, LA3
      • U1 LA 3.1 Inleiding Kleur
      • U1, LA 3.2 Maak je lievelingskleur in de HSB kleurmodus
      • U1 LA 3.3 Kleuren paletten
      • U1 LA3 Final Project: Album Art
  • Unit 2
    • Unit 2, LA1
      • U2 LA 1.1 Levensweg
      • U2 LA1.2 If-Then-Else Kleur die Robot
      • U2 LA 1.3 AND en OR
      • U2 LA1 Mini-Project Stoplicht
      • U2 LA1.4 Tekenen met de muis
      • U2 LA1.5 De map() functie
    • Unit 2, LA 2
      • U2 LA2.1 Raken met Collide2D
      • In Aanbouw
      • U2 LA 2.2 (in aanbouw)
      • U2 LA2 Final Project Light Switch Game
    • Unit 2, LA3
      • U2 LA 3.1 (in aanbouw)
      • U2 Final Project Painter
  • Unit 3
    • LA2 2.1 While Loops
    • LA2 2.?, Arrays en Loops
    • In Aanbouw
  • Blog
  • Docenten Info
  • Contact
    • Beoordeel P5js.nl
  • Links
    • P5JS Editor
    • P5JS.org
    • Video’s Coding Train
    • Reference
    • Intro to Computational Media
    • Freesound
Menu

LA 2, Arrays en Loops

Een array is een lijst van met variabelen. Het woord Array komt het Nederlandse UnRij. Dat krijgen die Engelsen niet uit hun b*k…

Voorbeeld Fruit

In een fruitmand zitten 4 stuks fruit. Je wilt ze allemaal displayen. Met dezelfde code. Je krijgt dan:

var fruit = [];
function setup() {
  createCanvas(400, 400);
  fruit[0]="appel"
  fruit[1]="sinaasappel"
  fruit[2]="peer"
  fruit[3]="ananas"
}
  • Definieer eerst je array variabele met []
  • Een array begint bij element 0.
  • array.length is een veelgebruikte truuk. In dit geval 4.

Een andere notatie voor dezelfde array is:

fruit[] = ["appel","sinaasappel","peer","ananas"]

Wel zo handig en snel.

Loop door de Array met een for-loop

function draw() {
  for (var f = 0; f < fruit.length; f++)
  text(fruit[f], 100, 100 + 20 * f);
}

Zo werkt de for-loop

  • startconditie f = 0
  • eindconditie f < fruit.length. Als deze conditie false is, klapt ie uit de loop en gaat eronder verder.
  • ophoging (increment). f++ is een afkorting voor als f = f + 1
  • fruit[f] is het f-de element van de array fruitmand

Dit is de vertaling-in-aanbouw van de Amerikaanse lesmethode Introduction to computational media (V2020, V2022) voor P5JS door Luisa Pereira.

Aangepast voor Nederland door docent Barry Voeten.

Creative Commons-Licentie
Dit werk valt onder een Creative Commons Naamsvermelding-NietCommercieel-GelijkDelen 4.0 Internationaal-licentie.
© 2022 p5js nl | Aangedreven door Minimalist Blog WordPress thema