Harvard University - CSCI E-3 (15118)

Graduate Assignment 1 Option #2: Create a Teaching Tip Chetak Patel Learning to use the Looping Property

by Chetak Patel

HTML

<h3>Harvard University - CSCI E-3 (15118)</h3>
<h3>Graduate Assignment 1</h3>
<h3>Option #2: Create a Teaching Tip</h3>
<h3>Chetak Patel</h3>
<h4>Learning to use the Looping Property</h4>

<p>Hey everyone, this is teaching tip on learning how to implement and use Looping in JavaScript. I Chetak Patel had a hard time getting the whole idea of looping in JavaScript and its purpose. After reviewing the concept multiple times and practicing, I have gotten it down and want to use this has a my teaching tip to share with other classmate that may also be struggling.</p>

<p>
Before we get started, let take it down to the basics:
What is Looping? Well Looping is exaclty as it sounds. It allows you to loop a code, or sets of codes, functions, arrays and many more. Just like a race track, its allows you to go from start to finish and back to start again, until you stop the loop, disable it or your finished looping what ever it is that your repeating. 
</p>
<p>JavaScipt supports a few different types of loops:
For loop, For/In loop, While loop, Do/While loop<br>
Lets take a look at a quick example of For Loop.
</p>
<h4>Example 1</h4>
<p id="example"></p>

<h4>Example 2</h4>
<p id="example2"></p>

<h4>
Now Lets take a look at a quick example of While Loop.
</h4>
<h4>Example 3</h4>
<p id="example3"></p>
<p>The biggest take away in using loops in Javascript is that there are many ways you or someone else could implment them into your code depending on the goal your trying to achive with them.
</p>
<p>Now lets take a look at using a loop as a function</p>
<h4>Example 4</h4>
<p id="example4"></p>
<button onclick="enableLoop()" type="button">Enable loop</button>
<button onclick="disableLoop()" type="button">Disable loop</button>
<button onclick="checkLoop()" type="button">Check loop status</button><br>
<video id="myVideo" iframe width="560" height="315" src="https://www.youtube.com/embed/EnR9ah0v1o4" frameborder="0" allowfullscreen>

JavaScript

//Example 1 - For loop for looping numbers up to 10.
var text = "";//open var to define our numbers
var i;
for (i = 0; i < 10; i++) {//Our loop shows for i which is equal to 0, and its less "<" 10, we want to add 1 to it evertime we print our define text.
    text += "My age is " + i + "<br>";
}
document.getElementById("example").innerHTML = text;

//Example 2 - For loop for looping string in an array.
var fruits = ["Apple", "Banana", "Grapes", "Oranges", "Kiwi", "Plums"];
var text = "";
var i;
for (i = 0; i < fruits.length; i++) {
    text += fruits[i] + "<br>";
}
document.getElementById("example2").innerHTML = text;

//Example 3 - While loop
var text = "";//Very similir concept, but in this case we are saying while i is equal to 0 print the text below.
var i = 0;
while (i < 10) {
    text += "<br>My age is " + i;
    i++;
}
document.getElementById("example3").innerHTML = text;