Lekker Javascripten

 

Les 5: De Rekenmachine

 

In deze les gaan we een rekenmachine maken. Hiervoor gebruiken we alleen maar een paar basis-operators. We beginnen met de standaard lay-out voor een javascript script:

<!DOCTYPE html>

<html>

<head></head>

<body>

 

<script>

</script>

 

</body>

</html>

 

Voor een rekenmachine hebben we 4 variabelen nodig: De twee getallen, een operator en een uitkomst. Hieronder definiëren we deze variabelen:

<!DOCTYPE html>

<html>

<head></head>

<body>

 

<script>

var index;

var getal1;

var getal2;

var uitkomst;

</script>

 

</body>

</html>

 

Nu moeten we ze ook nog iets laten doen, dus voor de index gaan we kijken wat er moet gebeuren (vermenigvuldigen, delen, optellen, aftrekken), en getal1 en getal2 gaan we ook een waarde voor vragen. Dit doen we met de prompt statement van eerder:

 

<!DOCTYPE html>

<html>

<head></head>

<body>

 

<script>

var index;

index = prompt(“Wat wil je doen? Typ in: ‘Vermenigvuldigen’, ‘Delen’, ‘Optellen’, ‘Aftrekken'”);

var getal1;

getal1 = prompt(“Wat wordt je eerste getal?”);

var getal2;

getal2 = prompt(“Wat wordt je tweede getal?”);

var uitkomst;

</script>

</body>

</html>

 

Nu gaan we met een switch-statement kijken wat er precies moet gebeuren en dat naar de variabele uitkomst kopiëren:

 

<!DOCTYPE html>

<html>

<head></head>

<body>

 

<script>

var index;

index = prompt(“Wat wil je doen? Typ in: ‘Vermenigvuldigen’, ‘Delen’, ‘Optellen’, ‘Aftrekken'”);

var getal1;

getal1 = prompt(“Wat wordt je eerste getal?”);

var getal2;

getal2 = prompt(“Wat wordt je tweede getal?”);

var uitkomst;

switch(index)

{

case Vermenigvuldigen: uitkomst = getal1 * getal2; break;

case Delen: uitkomst = getal1/getal2; break;

case Optellen: uitkomst = getal1 + getal2; break;

case Aftrekken: uitkomst = getal1 – getal2; break;

}

</script>

 

</body>

</html>

Als laatste moeten we de uitkomst nog afdrukken op het scherm, dit doen we met de document.write-functie. Hiervoor moeten we eerst de variabele omzetten tot een string, dit doe je met de variable.toString() functie. De variable kan dus elke variabele zijn die je wilt omzetten tot een string. Hieronder dus de totale code voor de rekenmachine.

 

<!DOCTYPE html>

<html>

<head></head>

<body>

 

<script>

var index;

index = prompt(“Wat wil je doen? Typ in: ‘Vermenigvuldigen’, ‘Delen’, ‘Optellen’, ‘Aftrekken'”);

var getal1;

getal1 = prompt(“Wat wordt je eerste getal?”);

var getal2;

getal2 = prompt(“Wat wordt je tweede getal?”);

var uitkomst;

switch(index)

{

case Vermenigvuldigen: uitkomst = getal1 * getal2; break;

case Delen: uitkomst = getal1/getal2; break;

case Optellen: uitkomst = getal1 + getal2; break;

case Aftrekken: uitkomst = getal1 – getal2; break;

}

var prt = uitkomst.toString();

document.write(prt);

</script>

 

</body>

</html>

 

Neem het zelf nog een keer door en probeer nu maar een papier-steen-schaar spel te maken. Met de kennis die je tot nu toe hebt gekregen kun je dat makkelijk!

 

Categorieën: Javascript