Skip to content

Instantly share code, notes, and snippets.

@ndonolli
Forked from anonymous/index.html
Last active June 27, 2016 01:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ndonolli/63355fb86bdc0291ebfd1fe9dcc40829 to your computer and use it in GitHub Desktop.
Save ndonolli/63355fb86bdc0291ebfd1fe9dcc40829 to your computer and use it in GitHub Desktop.
JS Bin// source https://jsbin.com/padivar
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<script id="jsbin-javascript">
/*
=====
LOOPS
=====
Loops, like if-else blocks, also alter the control flow of our program. A loop is a section of code that will repeat until certain conditions are met. This can be for many reasons - to cycle through elements in an array, to halt the program until a condition is true, et cetera.
In javascript there are two primary loops. One is a 'for' loop, and in general it is used to loop through a finite number of elements. Another widely used loop is a 'while' loop, which will continue looping until a certain condition is met. Loops are powerful, and dangerous - as an infinte loop will crash the program.
For Loops
---------
To make a for loop, we use the keyword 'for' followed by a parenthesis that takes three arguments. First, initializing the counter variable, then the condition to keep looping, then the increment at which to count. A simple for loop looks like this:
*/
for(var i = 1; i < 5; i++) {
console.log(i);
}
// > 1
// 2
// 3
// 4
/*
As you can see, this loop counts to 4. Variable i starts at 1, then increments by one until the condition (i < 5) is false. Let's try backwards!
*/
for(var i = 4; i > 0; i--) {
console.log(i);
}
// > 4
// 3
// 2
// 1
/*
We can use loops to cycle through elements in an array quickly, rather than calling upon each element individually with bracket notation.
*/
var groceryList = ['milk', 'eggs', 'bread', 'tequila'];
for(var i = 0; i < groceryList.length; i++) {
console.log(groceryList[i]);
}
// > "milk"
// "eggs"
// "bread"
// "tequila"
/*
When dealing with objects, we cannot use the for loop this way since the elements are not indexed. Instead we use the keyword 'in' to refer to the object's keys.
*/
var datingProfile = {
Name: 'Nathan Donolli',
Weight: 220,
Occupation: 'Professional Wrestler'
};
for(var key in datingProfile) {
console.log(key + ': ' + datingProfile[key]);
}
// > "Name: Nathan Donolli"
// "Weight: 220"
// "Occupation: Professional Wrestler"
// Looping through an object in reverse is a bit tougher, since there is no built in way to do so. One solution is to use multiple for loops:
var array = [];
for(var key in datingProfile) {
array.push((key + ': ' + datingProfile[key]));
}
for(var i = array.length - 1; i > -1; i--) {
console.log(array[i]);
}
// > "Occupation: Professional Wrestler"
// "Weight: 220"
// "Name: Nathan Donolli"
/*
While loops
-----------
While loops use the keyword 'while' and are followed by an expression. So long as the expression is false, the program will execute the bracketed section of the loop.
*/
var count = 1;
while (count < 4) {
console.log(count);
count++;
}
// > 1
// 2
// 3
// While loops can be useful in programs for creating conditional gateways as well.
var sleeping = true;
while (sleeping) {
console.log('Waking up');
sleeping = false;
}
// > "Waking up"
</script>
<script id="jsbin-source-javascript" type="text/javascript">/*
=====
LOOPS
=====
Loops, like if-else blocks, also alter the control flow of our program. A loop is a section of code that will repeat until certain conditions are met. This can be for many reasons - to cycle through elements in an array, to halt the program until a condition is true, et cetera.
In javascript there are two primary loops. One is a 'for' loop, and in general it is used to loop through a finite number of elements. Another widely used loop is a 'while' loop, which will continue looping until a certain condition is met. Loops are powerful, and dangerous - as an infinte loop will crash the program.
For Loops
---------
To make a for loop, we use the keyword 'for' followed by a parenthesis that takes three arguments. First, initializing the counter variable, then the condition to keep looping, then the increment at which to count. A simple for loop looks like this:
*/
for(var i = 1; i < 5; i++) {
console.log(i);
}
// > 1
// 2
// 3
// 4
/*
As you can see, this loop counts to 4. Variable i starts at 1, then increments by one until the condition (i < 5) is false. Let's try backwards!
*/
for(var i = 4; i > 0; i--) {
console.log(i);
}
// > 4
// 3
// 2
// 1
/*
We can use loops to cycle through elements in an array quickly, rather than calling upon each element individually with bracket notation.
*/
var groceryList = ['milk', 'eggs', 'bread', 'tequila'];
for(var i = 0; i < groceryList.length; i++) {
console.log(groceryList[i]);
}
// > "milk"
// "eggs"
// "bread"
// "tequila"
/*
When dealing with objects, we cannot use the for loop this way since the elements are not indexed. Instead we use the keyword 'in' to refer to the object's keys.
*/
var datingProfile = {
Name: 'Nathan Donolli',
Weight: 220,
Occupation: 'Professional Wrestler'
};
for(var key in datingProfile) {
console.log(key + ': ' + datingProfile[key]);
}
// > "Name: Nathan Donolli"
// "Weight: 220"
// "Occupation: Professional Wrestler"
// Looping through an object in reverse is a bit tougher, since there is no built in way to do so. One solution is to use multiple for loops:
var array = [];
for(var key in datingProfile) {
array.push((key + ': ' + datingProfile[key]));
}
for(var i = array.length - 1; i > -1; i--) {
console.log(array[i]);
}
// > "Occupation: Professional Wrestler"
// "Weight: 220"
// "Name: Nathan Donolli"
/*
While loops
-----------
While loops use the keyword 'while' and are followed by an expression. So long as the expression is false, the program will execute the bracketed section of the loop.
*/
var count = 1;
while (count < 4) {
console.log(count);
count++;
}
// > 1
// 2
// 3
// While loops can be useful in programs for creating conditional gateways as well.
var sleeping = true;
while (sleeping) {
console.log('Waking up');
sleeping = false;
}
// > "Waking up"
</script></body>
</html>
/*
=====
LOOPS
=====
Loops, like if-else blocks, also alter the control flow of our program. A loop is a section
of code that will repeat until certain conditions are met. This can be for many reasons - to
cycle through elements in an array, to halt the program until a condition is true, et cetera.
In javascript there are two primary loops. One is a 'for' loop, and in general it is used to
loop through a finite number of elements. Another widely used loop is a 'while' loop, which
will continue looping until a certain condition is met. Loops are powerful, and dangerous - as
an infinte loop will crash the program.
For Loops
---------
To make a for loop, we use the keyword 'for' followed by a parenthesis that takes three
arguments. First, initializing the counter variable, then the condition to keep looping,
then the increment at which to count. A simple for loop looks like this:
*/
for(var i = 1; i < 5; i++) {
console.log(i);
}
// > 1
// 2
// 3
// 4
/*
As you can see, this loop counts to 4. Variable i starts at 1, then increments by one until
the condition (i < 5) is false. Let's try backwards!
*/
for(var i = 4; i > 0; i--) {
console.log(i);
}
// > 4
// 3
// 2
// 1
/*
We can use loops to cycle through elements in an array quickly, rather than calling upon
each element individually with bracket notation.
*/
var groceryList = ['milk', 'eggs', 'bread', 'tequila'];
for(var i = 0; i < groceryList.length; i++) {
console.log(groceryList[i]);
}
// > "milk"
// "eggs"
// "bread"
// "tequila"
/*
When dealing with objects, we cannot use the for loop this way since the elements are not
indexed. Instead we use the keyword 'in' to refer to the object's keys.
*/
var datingProfile = {
Name: 'Nathan Donolli',
Weight: 220,
Occupation: 'Professional Wrestler'
};
for(var key in datingProfile) {
console.log(key + ': ' + datingProfile[key]);
}
// > "Name: Nathan Donolli"
// "Weight: 220"
// "Occupation: Professional Wrestler"
// Looping through an object in reverse is a bit tougher, since there is no built in way
// to do so. One solution is to use multiple for loops:
var array = [];
for(var key in datingProfile) {
array.push((key + ': ' + datingProfile[key]));
}
for(var i = array.length - 1; i > -1; i--) {
console.log(array[i]);
}
// > "Occupation: Professional Wrestler"
// "Weight: 220"
// "Name: Nathan Donolli"
/*
While loops
-----------
While loops use the keyword 'while' and are followed by an expression. So long as the
expression is false, the program will execute the bracketed section of the loop.
*/
var count = 1;
while (count < 4) {
console.log(count);
count++;
}
// > 1
// 2
// 3
// While loops can be useful in programs for creating conditional gateways as well.
var sleeping = true;
while (sleeping) {
console.log('Waking up');
sleeping = false;
}
// > "Waking up"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment