jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
jfraboni edited this page Jan 4, 2015 · 3 revisions

Code and Quiz

Code a little

Take the quiz

The power of computation is evident in the ability to process data. Most applications will at some point need to process collections of data.

Loops

Generally speaking, we call a bunch of things a list or a collection, and we call the things that make up a list or collection, elements or items. Specific programming languages have specific implementations of collections, and in JavaScript, we have the Array (indexed lists) and the Object (key / value pairs).

The concept of looping over the elements in a collection is called iteration. We iterate over each element in a collection to do something with each element.

Say for example, you have a list of friends, and you want to print their names and phone numbers. You could do someting like this:

console.log(myFriends[0].name+' : '+myFriends[0].phone);console.log(myFriends[1].name+' : '+myFriends[1].phone);console.log(myFriends[2].name+' : '+myFriends[2].phone);

...but what if you had 1,500 friends in that list? What if you didn't know the length of the list?

All programming languages have features that allow us to process or iterate over lists, take out each element in the list, do something with that element, then move on to the next element. Simply for the sake of effective code maintainance, its is much more effecient to use a loop than to hard-code accessing and processing every element in an Array. Our requirements could be much more easily expressed with the following loop:

for(vari=0;i<myFriends.length;i++){console.log(myFriends[i].name+' : '+myFriends[i].phone);}

A much more elegant solution, but leaning on the language feature of the for loop, we do not have to hard code any element position values, we don't have to repeat ourselves by writing code for every element in the Array, and we don't need to even know how many items are in the Array.

There's many options for looping in JavaScript; let's have a look at some of them.

The for Loop

The for-in Loop

The while Statement

While statements define a block of code that will excute over and over while a condition is true. They are essentially a loop.

####Syntax

Defined by the while keyword, followed by a condition within parenthesis, followed by a code block:

// while : while x is greater than 0, the body of the while loop will execute //varx=5;while(x>0){console.log(x);x--;}

The do-while Statement

Basically, another version of while, except that with the do-while statement, the code block is always executed at least once, and if the trailing conditional check equates to true, the block is executed again, until the conditional statement equates to false.

####Syntax

We use the keyword do, followed by a code block, followed by the keyword while, finally followed by a conditional check:

// do while : while i is less than 5, body of the do-while loop will execute //vari=0;do{console.log(i);i++;}while(i<5);

© 2014-2015 Operation Spark

Clone this wiki locally