Skip to content
Christian Rishøj edited this page Mar 24, 2019 · 5 revisions

Loops are everywhere in programming. It is the one thing that allows you to do infinite repetitions. So take some time to understand these constructs. They will be the base of most of your scripts

while ( Boolean ) { /* Do Stuff Here! */ }

for ( var i = 0; i < thing.length; i++ ){ /* Do Stuff Here! */ }

for (var key in Object ){ /* Do Stuff Here! */ }

    var x = [1,2,3]
    for ( var i = 0; i < x.length; i++ ) {
        x[i] += 1;
    }  
    alert(x);

Let's play with loops

    /*
     Loops
    */
    
    // this is our string
    var source_string = "Hi there. I am a string please chop me into pieces";
    var source_array = new Array(); // create a new array like this
    var target_array = []; // or like this
    var target_string; // this will hold our result
    var delimiter = " "; // this is what we use to split and join our string
    
    var source_array = source_string.split (delimiter);// split the string into an array
    
    
    alert("Source string: "+source_string + "\nTarget array:\n"+ source_array); // lets see what it did
    
    /*
    Now loop that array we created
    there are three parts in this for loop construct
    var index = 0; // this is our counter 
    than follows a condition
    index < source_array.length
    as long as this is true we do the third part
    index = index + 1; // we increment the index by one
    
    Than the condition loop block { } is executed
    when the block is done he will again check if the condition
    index < source_array.length
    is still true. If so increment by one and execute the block { }
    
    you can stop a loop by using break;
    
    like:
    
    if(index == 5){
    break;
    }
    
    or step over one index by using
    
    if(index == 5){
    continue
    }
    
    Play with it a lot. Don't worry you wont go blind
    
    */
    for(var index = 0; index < source_array.length; index = index + 1 ){
         target_array.push(source_array[index]);
        }
    
    
    // lets see what happened in the target array
    alert("Target array: "+target_array);
    
    // join the array again
    target_string = target_array.join (delimiter);
    
    // hey we got our string back
    alert("hey we got our string back:\n"+ target_string);

There is a different kind of loop. The while loop. He does the same as every other loop but depends more on a condition than in/decreasing an index. Have a look at it:

    var highest_value = 20;
    
    var counter = 0;
    
    var aNumber = 200;
    while(counter < highest_value){
        aNumber-=20;
        
        counter++;
        }
    
    alert("Our result is: "+ aNumber);

Looping Objects

The third kind of loop the for(var key in object) can be used to loop objects. Here the key is not can be an index. Important is it also can be the name of a property. Don't use these loops an Arrays! Have a look at this stackoverflow

    var obj = {
        "a":"Hello World",
        "b":5.5,
        "c":true,
        "x":[1,2,3]
    };//Object  

    for ( var key in obj ){ 
         if (obj.hasOwnProperty(key)){
        alert( key );
      }
    }  
    alert(obj["a"]);

Strange Looping

You can also create for loops like the following one. But you wont see this very often.

    var i =0;
    var counter = 5
    for(i;i < 5;i++,counter++){
      alert(counter);    
    }
Clone this wiki locally