famtrol
Artikelen: 0
Berichten: 25
Lid geworden op: za 13 mei 2017, 13:34

javascript loop

Hallo
ik was bij het opzoeken van informatie over het statement break en continue in javascript op een voorbeeld gekomen dat me niet juist leek maar het loopt wel correct. ik heb dan een aanpassingen gedaan volgens mijn logica en is ook correct. het gaat hem eigenlijk enkel over het stukke met de werking va nde forloop:


Maar ik begrijp niet hoe dit voorbeeld kan werken. ik geef wat extra uitleg: https://www.w3schools.com/js/tryit.asp? ... s_continue

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Loops</h2>
<p>A loop with a <b>continue</b> statement.</p>
<p>A loop which will skip the step where i = 3.</p>
<p id="demo"></p>

<script>
let text = "";
for (let i = 0; i < 10; i++) {
if (i === 3) { continue; }
text += "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

voor mij lijkt het logische deze lijn : document.getElementById("demo").innerHTML = text; binnen de loop te plaatsten.
Ik dacht dat je met een forloop een aantal keren de loop doorloopt tot de voorwaarde om te stoppen ( hier i<10 ) is voldaan en daarna ga je verder na de loop .. maw de regels na de sluitaccolade

maw , ik zou volgende code correcter vinden :

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Loops</h2>
<p>A loop with a <b>continue</b> statement.</p>
<p>A loop which will skip the step where i = 3.</p>
<p id="demo"></p>

<script>
let text = "";
for (let i = 0; i < 10; i++) {
if (i === 3) { continue; }
text += "The number is " + i + "<br>";
document.getElementById("demo").innerHTML = text;
}

</script>

</body>
</html>

beide werken ... maar ik begrijpt niet hoe de eerste versie correct kan werken. je blijft tot steeds binnen je loop tot i<10 en toch drukt het progamma de " text " af.
Gebruikersavatar
Xilvo
Moderator
Artikelen: 0
Berichten: 10.756
Lid geworden op: vr 30 mar 2018, 16:51

Re: javascript loop

Laat ik beginnen met te zeggen dat ik javascript niet ken. Ik weet bijvoorbeeld niet precies wat "document.getElementById("demo").innerHTML = text;" precies doet.

Maar het heeft wel een grote overeenkomst met C waar ik wel mee gewerkt heb.

Zoals ik het nu lees begrijp ik niet waarom jouw (de laatste) versie goed zou werken.

In beide versies staat "text+=...", dat betekent dat iedere keer dat de lus doorlopen wordt er wat aan die tekst toegevoegd wordt.

In de eerste versie wordt pas na die lus (na de accolade) die tekst blijkbaar getoond met "document.getElementById("demo").innerHTML = text;"

In jouw versie zou ik verwachten dat je tijdens het doorlopen van de lus al steeds het stukje te zien krijgt wat tot dan toe is opgebouwd, dus
The number is 0

The number is 0
The number is 1

The number is 0
The number is 1
The number is 2

The number is 0
The number is 1
The number is 2
The number is 4
etc.
en dan eventueel zonder die lege regels die ik heb toegevoegd om het duidelijker te maken.
Gebruikersavatar
irArjan
Artikelen: 0
Berichten: 388
Lid geworden op: vr 23 okt 2009, 13:04

Re: javascript loop

Wat er in beide gevallen gebeurd is dat de text variabele zich vult met "The number is x <br>" (met x het betreffende nummer).

De regel "document.getElementById("demo").innerHTML = text;" doet een update op de html pagina. Deze vult dus voor de 'innerHTML' (de body? mijn java is ook niet heel goed) met de variabele 'text'.

Omdat de text variabele zich de hele loop vult met "The number is x <br>" heb je aan het eind dus 9 x dat statement erin staan. Je hoeft de pagina daarom maar 1x te updaten. In het tweede geval wordt de pagina in iedere loop geupdate met een 'text' variabele die iedere keer een regel meer bevat. Het tussendoor updaten is echter niet nodig, en zelfs onwenselijk lijkt me. Deze updates gaan echter zo snel dat je dat niet ziet.
famtrol
Artikelen: 0
Berichten: 25
Lid geworden op: za 13 mei 2017, 13:34

Re: javascript loop

Beste Xilvo , Beste irArjan is me duidelijk nu . Bedankt beide voor de info . ik hadidd over het hoofd gezien dat met de += idd de vorige info steeds ook wordt bijgehouden en er bij elke lus steeds de nieuwe info wordt toegevoegd .
thx !

Terug naar “Informatica en programmeren”