Week 6 java script loops

Week 6 java script loops

• 1.
  Speaking in Code Introto JavaScript Loops! Brian Lee Professor Liel Leibovitz
• 2.
  Speaking in Code Review– Functions • Easy way to reuse code • Define a set of statements through one variable var divideByThree = function (number) { var val = number / 3; console.log(val); };
• 3.
  Speaking in Code Review– Functions: Name • The name of the function that will execute var divideByThree = function (number) { var val = number / 3; console.log(val); }; • Run the function by calling its name divideByThree(9);
• 4.
  Speaking in Code Review– Functions: Parameters • Parameters are passed in for the function to use • Similar to a variable in math f(x) = x2 + 2 • Calling function with x = 3 f(3) = 32 + 2 >> 11
• 5.
  Speaking in Code Review– Functions: Parameters • In JavaScript passing in 3: myFunc(3); var myFunc = function (number) { var val = Math.pow(number, 2) + 2; console.log(val); }; var myFunc = function (3) { var val = Math.pow(3, 2) + 2; console.log(val); };
• 6.
  Speaking in Code Review– Functions: Return Values • What good are functions if all you do is print • A functions return value is similar to a variable var addThree = function (number) { return number + 3; }; var count = addThree(4); console.log(count) >> 7
• 7.
  Speaking in Code Review– Functions: Return Values • You can assign to a variable or use it right away if(addThree(4) > 10) { console.log(“We’re over 10!”); } else { console.log(addThree(4) + “ is not over 10”); } >> “7 is not over 10”
• 8.
  Speaking in Code Review– Functions: Scope (Local) • Where you define your variables matter • Variables defined inside a function ONLY exist there var multiplyThree = function (number) { var multiplier = 3; return multiplier * number; }; console.log(multiplier) >> multiplier is not defined
• 9.
  Speaking in Code Review– Functions: Scope (Global) • Where you define your variables matter • Variables defined outside a function exist globally var multiplier = 3; var multiplyThree = function (number) { return multiplier * number; }; console.log(multiplier) >> 3
• 10.
  Speaking in Code Functionsin other languages • JavaScript var square = function (number) { return number * number; }; • Ruby (method) def square(number) return number * number end
• 11.
  Speaking in Code Intro:Loops • Execute same line(s) of code over and over • Fundamental concept in programming • Can be trickier with JavaScript
• 12.
  Speaking in Code Intro:For Loops • Basic Syntax for(var i = 0; i < 10; i++) { console.log(i); } • Initialization: define variable useful to loop • Conditional: keep looping while this is true – is “i” currently less than 10? • Increment: executed at the end of the loop
• 13.
  Speaking in Code Intro:Loop Mechanics • In what order does this loop think? for(var i = 0; i < 10; i++) { console.log(i); } 1. Initialization 2. Check Conditional: Stop loop if false 3. Run Code 4. Run Increment: i++ i=i+1 5. Step 2
• 14.
  Speaking in Code InfiniteLoops • Loops with no exit strategy • Will continue to execute until crashing
• 15.
  Speaking in Code InfiniteLoops • Why would this loop not work? for(var i = 0; i < 10; i--) { console.log(i); }`
• 16.
  Speaking in Code InfiniteLoops • Why would this loop not work? for(var i = 0; i < 10; i--) { console.log(i); }` >> -1 >> -2 >> -3 >> -4 … >> -467389146129
• 17.
  Speaking in Code Arrays
• 18.
  Speaking in Code Arrays •Collection of items • Like a box (even looks like it) [] • Each item has a designated spot var doughnuts= [ , , , ]
• 19.
  Speaking in Code Arrays:Accessing Elements • Elements: items in arrays • Index: location of element in array – Starts from 0 not 1 var doughnuts= *‘Boston Creme’, ‘Glazed’, ‘Old Fashioned’ + • How to access the value “Boston Creme”
• 20.
  Speaking in Code Arrays:Accessing Elements • Elements: items in arrays • Index: location of element in array – Starts from 0 not 1 var doughnuts= *‘Boston Creme’, ‘Glazed’, ‘Old Fashioned’ + 0 1 2 • How to access the value “Boston Creme” doughnuts[0]
• 21.
  Speaking in Code Loopsand Arrays • Use loops to write less code var doughnuts = *‘Boston Creme’, ‘Glazed’, ‘Old Fashioned’ ] for(var i = 0; i < doughnuts.length; i++) { console.log(“This box has “ + doughnuts*i]) } >> “This box has Boston Crème” >> “This box has Glazed” >> “This box has Old Fashioned”
• 22.
  Speaking in Code Tryit yourself!  http://bit.ly/jsloops http://jsbin.com
• 23.
  Speaking in Code RealWorld Example • Facebook: – Ever wanted to select all friends when sending out invites? var elms = document.getElementsByName("checkableitems[]"); for (i = 0; i < elms.length; i++) { if (elms[i].type === "checkbox”) , elms[i].click(); } }