Skip to content

Instantly share code, notes, and snippets.

/index.html

Created December 4, 2016 06:00
Show Gist options
  • Save anonymous/a3b6af052361b2dcec6282d8777c8524 to your computer and use it in GitHub Desktop.
Save anonymous/a3b6af052361b2dcec6282d8777c8524 to your computer and use it in GitHub Desktop.
Download ZIP
Looping Looping studies // source https://jsbin.com/fuqawu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Looping studies">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Looping</title>
</head>
<body>
<script id="jsbin-javascript">
// -----Loops----- //
/* For loops are great tools for iterating over individual elements within an array
to work with them. A for loop has three sections within its proceeding parentheses: an
initialization, conditional statement, and a final expression. The initialization phase
usually declares a variable. The conditional statement phase tells the loop when to stop,
and the final expression performs an action at the end, usually incrementing or
decrementing a counter: */
"use strict";
var arr = ["What is love?", "I love you", "I hate you", 24, "Baby, don't hurt me"];
for (var i = 0; i < arr.length; i++) {
if (i === 0 || i === 4) {
console.log(arr[i]);
}
}
/* It is possible to loop through the array in more than one direction: */
for (var i = arr.length; i > 0; i--) {
if (i === 2) {
console.log(arr[i]);
}
}
/* a while loop is similar to a for loop, except a while loop only contains a conditional
statement within its parentheses. It will require a counter of some sort to tell the loop
when to stop. This counter is easy to forget but VERY important; executing a while loop without
it will cause an infinite loop and possibly crash the program. */
var n = 0;
while (n < 3) {
console.log("Beatlejuice");
n += 1; // super important to remember
}
/* A for in loop does for objects what the for loop does for an array--it iterates over the
object's enumerable properties and performs an action at every stop. */
var obj = {
a: 1,
b: 2,
c: 3
};
for (var key in obj) {
console.log(key + ": " + obj[key]);
}
/* Since objects are innately unsorted and looping through in a particular order can't be guaranteed,
to get closer to looping in the order you wish, some external arranging must first take place.
For example, using a regular for in loop may iterate through the key/values in the order they
were assigned. To loop backwards, you could extract the keys and place them into an array,
reverse the order of the array, and then use a for loop to iterate through the array and return
a new object: */
function reverseObj(object) {
var newObj = {};
var arr = Object.keys(object);
arr.reverse(); // could also skip this line and iterate backwards in the for loop instead
for (var i = 0; i < arr.length; i++) {
newObj[arr[i]] = obj[arr[i]];
// console.log(newObj); Uncomment me and you will see it insert the key/values in reverse
}
return newObj;
}
reverseObj(obj);
/* Depending on which browser or program runs this code, it may still log it in the console
in alphabetical order, but logging within the for loop displays the correct results. */
</script>
<script id="jsbin-source-javascript" type="text/javascript">// -----Loops----- //
/* For loops are great tools for iterating over individual elements within an array
to work with them. A for loop has three sections within its proceeding parentheses: an
initialization, conditional statement, and a final expression. The initialization phase
usually declares a variable. The conditional statement phase tells the loop when to stop,
and the final expression performs an action at the end, usually incrementing or
decrementing a counter: */
var arr = ["What is love?", "I love you", "I hate you", 24, "Baby, don't hurt me"];
for (let i = 0; i < arr.length; i++) {
if (i === 0 || i === 4) {
console.log(arr[i]);
}
}
/* It is possible to loop through the array in more than one direction: */
for (let i = arr.length; i > 0; i--) {
if (i === 2) {
console.log(arr[i]);
}
}
/* a while loop is similar to a for loop, except a while loop only contains a conditional
statement within its parentheses. It will require a counter of some sort to tell the loop
when to stop. This counter is easy to forget but VERY important; executing a while loop without
it will cause an infinite loop and possibly crash the program. */
var n = 0
while (n < 3) {
console.log("Beatlejuice");
n += 1; // super important to remember
}
/* A for in loop does for objects what the for loop does for an array--it iterates over the
object's enumerable properties and performs an action at every stop. */
var obj = {
a: 1,
b: 2,
c: 3
};
for (let key in obj) {
console.log(key + ": " + obj[key]);
}
/* Since objects are innately unsorted and looping through in a particular order can't be guaranteed,
to get closer to looping in the order you wish, some external arranging must first take place.
For example, using a regular for in loop may iterate through the key/values in the order they
were assigned. To loop backwards, you could extract the keys and place them into an array,
reverse the order of the array, and then use a for loop to iterate through the array and return
a new object: */
function reverseObj(object) {
var newObj = {};
let arr = Object.keys(object);
arr.reverse(); // could also skip this line and iterate backwards in the for loop instead
for (let i = 0; i < arr.length; i++) {
newObj[arr[i]] = obj[arr[i]];
// console.log(newObj); Uncomment me and you will see it insert the key/values in reverse
}
return newObj;
}
reverseObj(obj);
/* Depending on which browser or program runs this code, it may still log it in the console
in alphabetical order, but logging within the for loop displays the correct results. */</script></body>
</html>
Raw
jsbin.fuqawu.js
// -----Loops----- //
/* For loops are great tools for iterating over individual elements within an array
to work with them. A for loop has three sections within its proceeding parentheses: an
initialization, conditional statement, and a final expression. The initialization phase
usually declares a variable. The conditional statement phase tells the loop when to stop,
and the final expression performs an action at the end, usually incrementing or
decrementing a counter: */
"use strict";
var arr = ["What is love?", "I love you", "I hate you", 24, "Baby, don't hurt me"];
for (var i = 0; i < arr.length; i++) {
if (i === 0 || i === 4) {
console.log(arr[i]);
}
}
/* It is possible to loop through the array in more than one direction: */
for (var i = arr.length; i > 0; i--) {
if (i === 2) {
console.log(arr[i]);
}
}
/* a while loop is similar to a for loop, except a while loop only contains a conditional
statement within its parentheses. It will require a counter of some sort to tell the loop
when to stop. This counter is easy to forget but VERY important; executing a while loop without
it will cause an infinite loop and possibly crash the program. */
var n = 0;
while (n < 3) {
console.log("Beatlejuice");
n += 1; // super important to remember
}
/* A for in loop does for objects what the for loop does for an array--it iterates over the
object's enumerable properties and performs an action at every stop. */
var obj = {
a: 1,
b: 2,
c: 3
};
for (var key in obj) {
console.log(key + ": " + obj[key]);
}
/* Since objects are innately unsorted and looping through in a particular order can't be guaranteed,
to get closer to looping in the order you wish, some external arranging must first take place.
For example, using a regular for in loop may iterate through the key/values in the order they
were assigned. To loop backwards, you could extract the keys and place them into an array,
reverse the order of the array, and then use a for loop to iterate through the array and return
a new object: */
function reverseObj(object) {
var newObj = {};
var arr = Object.keys(object);
arr.reverse(); // could also skip this line and iterate backwards in the for loop instead
for (var i = 0; i < arr.length; i++) {
newObj[arr[i]] = obj[arr[i]];
// console.log(newObj); Uncomment me and you will see it insert the key/values in reverse
}
return newObj;
}
reverseObj(obj);
/* Depending on which browser or program runs this code, it may still log it in the console
in alphabetical order, but logging within the for loop displays the correct results. */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment