Les 5 - arrays, for-loops en modulo

---

Les 5 ging over arrays, for-loops en modulo + wat andere tips.

De presentatie van deze les vind je hier: Javascript-les-5.pdf

En de code van deze les:

//initiele lijst
let lijst = [100,43,12,54,20,14,65,8,60,330,12,13,5];

function setup() {
  //windowWidht & windowHeight voor volledige schermhoogte en -breedte
  createCanvas(windowWidth,windowHeight);
  background(255);
  console.log(lijst.length);
  //zet de balk in het midden
  rectMode(CENTER);
  //zet de tekst in het midden
  textAlign(CENTER);
}

function draw() {
  //plaats hier de code die continue herhaald moet worden.
  background(255);
  for (let i = 0; i < lijst.length; i++) {
    //bepaal offset a.d.h.v lijstlengte
    let offset = width/lijst.length;

    //bepaal de x-positie van de balk
    let x = i * (offset) + ((offset)/2);

    //bepaal de y-positie van de balk
    let y = height-lijst[i]/2; 

    //teken balk en tekst.
    rect(x,y,20,lijst[i]);
    text(lijst[i], x, y - (lijst[i]/2) - 10);
  }
}

function mousePressed() {
  //leeg de lijst, anders blijft de lijst altijd even lang.
  lijst = [];
  //bepaalde lengte van de lijst, in integers.
  let length = int(random(1,50));
  //hieronder wat andere manieren om getallen af te ronden
  // let length = floor(random(1,50));
  // let length = round(random(1,50));
  // let length = ceil(random(1,50));

  //ga door elk element van de nieuwe lijst
  for (let i = 0; i < length;i++ ) {
    let randomHeight;
    //eens in de vier keer doe je iets anders dan de andere keren
    if (i % 4 == 0) {
      randomHeight = random(100,200);
    }
    else {
      randomHeight = random(25,75);
    }

    //plaats de nieuwe waarde in de lijst.
    lijst[i] = int(randomHeight);
  }
}