Jason Lydon: Web Designer, Web Developer, Graphic Designer, Video Producer and Digital Maestro

First of all, when I think of reflections, I think of this

ASSIGNMENT

Watch this video
Questions for reflection (please reflect on your blog and discuss in comments below):

• 1. Why do languages provide the switch statement, when we can achieve the same thing with multiple if… elseif statements? Show one example of how you might use the switch statement.
  A: To be honest, I haven’t found a good explanation for why ‘switch’ was originally implemented (other than it is in C++), but I have found plenty of examples where it is praised as “simple to use, logical in syntax, and most importantly, many programmers swear by it”1 . So there are plenty of examples for why it stuck around.
  Example:

  switch (today){
        case"sunday":
              alert("You watch TV, it's Sunday");
              [break;]
        case"monday":
              alert("Who's got a case of the Mondays?");
              [break;]
        case"tuesday":
              alert("It's only Tuesday, STFU!");
              [break;]
        case"wednesday":
              alert("Humpday");
              [break;]
        case"thursday":
              alert("Tonight is the best night on NBC");
              [break;]
        case"friday":
              alert("Rally and peak at 9pm, bed by 11");
              [break;]
        case"saturday":
              alert("Saturday, it's a Saturday");
              [break;]
        default:
              alert("Your society has no word for today's name!");
              [break;]
  }
  

• 2. What is encapsulation, and what do functions encapsulate?
  A: Encapsulation: “every class inherits the methods of its parent and only needs to define things it wishes to change” or “A Class defines only the characteristics of the Object, a method defines only how the method executes.”2
  Functions encapsulate local variables.
• 3. What is a pure function? Is the function show() provided in Eloquent Javascript a pure function?
  A: Pure functions are function that “have no memory or I/O side effects”3 Side effects mean “in addition to producing a value, it also modifies some state or has an observable interaction with calling functions or the outside world.”4 So basically a pure function is basic mathematics, 2 + 2 = 4, always. And no variables are affected
  I don’t think the show() is a pure function because it does the bidding of the function associated within it, therefore it does change variables and not do a basic math function.
• 4. What do we mean when we say a variable in a function is shadowing a top level variable?
  A: A top level variable is a variable created outside functions that can be accessed by ALL functions. When a function calls a variable, it first looks for it locally (aka inside this function) and if not found it then looks outside the function to the top level variables. I guess it is a shadow because top level variables are out there and obvious, while a variable with the same name is hiding in the shadows of the function waiting to pounce when it is needed.
• 5. A recursive function must have some sort of an end condition. Why would we get a “out of stack space” error message if a recursive function does not have an end condition?
  “To understand recursion you must first understand recursion”5
  A: A recursive function is a function that calls itself inside itself. Without an end statement, it would continue on forever. The “stack” is where the web browser stores the variables as it works thru functions, each browser has a limited amount of space, thus, if a function runs on forever and continues working thru variables, it will run out of space in the stack.
• 6. Reflect about the difference between object inheritance and class inheritance
  A: Object inheritance allows you to basically make a copy of an object that you expand upon. Class inheritance means that you need to define a new class tat extends a previous class and then create objects of that class.6
• 7. What is object augmentation, and how do we do it?
  A: Object Augmentation: Take an existing object and add new stuff to it at anytime. To do it, simply assign it. The general pattern is myObject[name] = value;
  Just do it!
• 8. There is a way to add a method to String, such as any new String we create will have that augmented method (this is a bit different from object augmentation). How would you do this?
  A:

  String.prototype.newMethod = function (foo, bar) {
      //put code for new String function here
  }
  

• 9. What is garbage collection?
  A: According to the video, it’s “mark and sweep so cycles do get reclaimed”, which meant almost nothing to me, but the internets told me it is basically the “collector” flags each block of data or variable that the program can reach, it then deletes any blocks without flags because they are not being used.
• 10. What is the difference between an array and an object?
  A: Array inherits from Object. Arrays have a length, and objects do not. The video recommends that you use objects when the names are arbitrary strings and use arrays when the names are sequential integers.

Exercises 3.1 – 3.2 from chapter 3

• 3.1 – Write a function called absolute, which returns the absolute value of the number it is given as its argument. The absolute value of a negative number is the positive version of that same number, and the absolute value of a positive number (or zero) is that number itself.

  function absolute(arg){
     if (arg < 0 ){
        return -arg
     } else {
        return arg
     }
  }
  

  I then used buttons to open alerts for different numbers
  See an example here.

• 3.2 - Write a function greaterThan, which takes one argument, a number, and returns a function that represents a test. When this returned function is called with a single number as argument, it returns a boolean: true if the given number is greater than the number that was used to create the test function, and false otherwise.

  function greaterThan(x) {
     return function(y) {
        return y > x;
     };
  }
  var greaterThanTen = greaterThan(10);
  alert(greaterThanTen(9));
  

  See it here

#p2pu-Jan2011-javascript101

Some of these questions were asked in Track 1, I would be lying if I told you I didn’t copy & paste them here

• Q: What is a type, and why do you think types are useful in writing programs?
  A: Types are a way to categorize values in a program. They are useful because they restrict what kind of values can be used and allows the programs to run faster because the programs knows what to do with the values instead of trying to sort out what the user wants them to do with the values.
• Q: Why do we lose precision when performing operations with decimal numbers in Javascript? Can you think of a few implications of why this would be a problem?
  A: We lose precision because JS uses something called “floating point” to map the arithmetic. Because of this, “.1 + .2 != .3″. This is a problem when dealing with money because for some crazy reason, people expect the math to add up properly. The video recommends that you sort out the decimals into cents and then back to decimals when working with money.
• Q: Do you understand why the following operation produces the given result 115 * 4 – 4 + 88 / 2 = 500
  A: Yeah, because basic math has taught us that *, +, -, and / are not all created equal, the equation doesn’t perform left to right as written. It would actually be re-ordered like so:
  115 * 4 = 460
  460 – 4 = 456
  88/2 = 44
  456 + 44 = 500
• Q: What is the use of a backslash character in a String?
  A:
• Q: What does typeof 4.5 do, and why does typeof (typeof 4.5) return “string” ?
  A: typeof “returns a string indicating the type of the unevaluated operand.” So typeof 4.5 should return number because 4.5 is a number. And typeof (typeof 4.5) should return string because typeof isn’t being done twice, the second “typeof” is the operand being evaluated. It is words and numbers, thus it is a string.
• Q: The author writes When your browser loads a page, it creates a new environment and attaches these standard values to it. The variables created and modified by programs on that page survive until the browser goes to a new page.. Without searching on the net, can you think of some variables that might be created in the browsers environment when it loads a page with Javascript in it?
  A:

Homework:

Exercises 2.1 – 2.6 from chapter 2 of Eloquent Javascript

• 2.1 – Is this true?
  (4 >= 6 || “grass” != “green”) && !(12 * 2 == 144 && true)
  the number four is less than and equal to the number 6 (wrong) OR the string “grass” is not equal to the string “green” (correct)
  AND
  the number twelve times two = 144 (incorrect) AND true (is neither correct or incorrect, but is is true!)
  aka (false || true) && !(false && true)
  when using OR aka ||, if either one is true, then the result is true, therefore (false || true) == true
  when using AND aka &&, both have to be true to equal true, therefore (false && true) == false
  (true) && !(false)
  !(false) = true
  (true) && (true)
  And as previously stated, you need both to answer true when using && to be true so our final answer is TRUE!
  and that is how I think a computer would process this example, but it needs 1/100000th of a second to process that whole thought…
• 2.2 – Use the techniques shown so far to write a program that calculates and shows the value of 210 (2 to the 10th power).

  var counter = 2;
  // because 2*2 is done right off the bat
  var our_number = 2;
  while (counter <= 10){
  our_number = our_number * 2;
  counter++;
  alert(our_number);
  }
  

  see it in action here

• 2.3 - With some slight modifications, the solution to the previous exercise can be made to draw a triangle. And when I say 'draw a triangle' I mean 'print out some text that almost looks like a triangle when you squint'.

  var counter = 1;
  var triangles_son = "#";
  while (counter <= 10){
  document.write(triangles_son + "");
  counter++;
  triangles_son = triangles_son + "#";
  }
  

  see it in action here

• 2.4 - Rewrite the solutions of the previous two exercises to use for instead of while.

  var our_number = 2;
  for (var counter = 2; counter <= 10; counter++){
  our_number = our_number * 2;
  alert(our_number);
  }
  

  see it in action here

  var triangles_son = "#";
  for (counter = 1; counter <= 10; counter++) {
  document.write(triangles_son + "");
  triangles_son = triangles_son + "#";
  }
  

  see it in action here

• 2.5 - Write a program to ask yourself, using prompt, what the value of 2 + 2 is. If the answer is "4", use alert to say something praising. If it is "3" or "5", say "Almost!". In other cases, say something mean.

  var nerd_wisdom = prompt("Yo math professor! What does 2 + 2 equal?", "");
  if (nerd_wisdom == "4"){
  alert("Holy crap, you're as smart as my 6 year old nephew!");
  } else if (nerd_wisdom == "3" || nerd_wisdom == "5"){
  alert("Almost! And by almost, I mean 'really?'");
  } else {
  alert("Come on bro, really? I mean really? My cat knows the answer to this.");
  }
  

  see it in action here

• 2.6 - Add a while and optionally a break to your solution for the previous exercise, so that it keeps repeating the question until a correct answer is given.
  Note that while (true) ... can be used to create a loop that does not end on its own account. This is a bit silly, you ask the program to loop as long as true is true, but it is a useful trick.

  var nerd_wisdom;
  while(true){
  	nerd_wisdom = prompt("Yo math professor! What does 2 + 2 equal?", "");
  	if (nerd_wisdom == "4"){
  	alert("Holy crap, you're as smart as my 6 year old nephew!");
  	break;
  	} else if (nerd_wisdom == "3" || nerd_wisdom == "5"){
  	alert("Almost! And by almost, I mean 'really?'");
  	} else {
  	alert("Come on bro, really? I mean really? My cat knows the answer to this.");
  	}
  }
  

  see it in action here

• Create an example that shows a valid use of the 'guard' and 'default' operators in Javascript.

  var jason_lydon = awesome && awesome.too_the_extreme;

Exercises 3.1 - 3.2 from chapter 3

• 3.1 - Write a function called absolute, which returns the absolute value of the number it is given as its argument. The absolute value of a negative number is the positive version of that same number, and the absolute value of a positive number (or zero) is that number itself.

  function absolute(arg){
     if (arg < 0 ){
        return -arg
     } else {
        return arg
     }
  }
  

  I then used buttons to open alerts for different numbers
  See an example here.

• 3.2 - Write a function greaterThan, which takes one argument, a number, and returns a function that represents a test. When this returned function is called with a single number as argument, it returns a boolean: true if the given number is greater than the number that was used to create the test function, and false otherwise.

  function greaterThan(x) {
  	  return function(y) {
  		return y > x;
  	  };
  	}
  
  	var greaterThanTen = greaterThan(10);
  	alert(greaterThanTen(9));
  

  See it here

#p2pu-Jan2011-javascript101

Questions for reflection (please reflect on your blog and discuss in comments below):

• Q: The alliance of Netscape and Sun Microsystems did not use Java in the browser, because it was not suitable for that purpose. Why do you think Java was not suitable to be embedded in a browser?
  A: According to the video, it is because Java was “way too heavy, way too clumsy to do apis and process form validation”. They needed something lighter to run in a browser. Or simply, according to Netscape, “it just didn’t work”.
• Q: When parsing a String into a number using the parseInt() method, we are advised to always provide the radix. Why is it so strongly recommended?
  A: “It tells it what base to calculate in. The reason for that is is that it stops at the first non-digit integer that it sees and if the first digit is zero, it is allow to interpret it as an octal constant.” Which basically means that it would interpret any number starting with 0 as 0, even if it is something like 09.
• Q: What is a type, and why do you think types are useful in writing programs?
  A: Types are a way to categorize values in a program. They are useful because they restrict what kind of values can be used and allows the programs to run faster because the programs knows what to do with the values instead of trying to sort out what the user wants them to do with the values.
• Q: Why do we lose precision when performing operations with decimal numbers in Javascript? Can you think of a few implications of why this would be a problem?
  A: We lose precision because JS uses something called “floating point” to map the arithmetic. Because of this, “.1 + .2 != .3″. This is a problem when dealing with money because for some crazy reason, people expect the math to add up properly. The video recommends that you sort out the decimals into cents and then back to decimals when working with money.
• Q: Do you understand why the following operation produces the given result 115 * 4 – 4 + 88 / 2 = 500
  A: Yeah, because basic math has taught us that *, +, -, and / are not all created equal, the equation doesn’t perform left to right as written. It would actually be re-ordered like so:
  115 * 4 = 460
  460 – 4 = 456
  88/2 = 44
  456 + 44 = 500
• Q: What does typeof 4.5 do, and why does typeof (typeof 4.5) return “string” ?
  A: typeof “returns a string indicating the type of the unevaluated operand.” So typeof 4.5 should return number because 4.5 is a number. And typeof (typeof 4.5) should return string because typeof isn’t being done twice, the second “typeof” is the operand being evaluated. It is words and numbers, thus it is a string.

Homework:

Exercises 2.1 – 2.6 from chapter 2 of Eloquent Javascript

• 2.1 – Is this true?
  (4 >= 6 || “grass” != “green”) && !(12 * 2 == 144 && true)
  the number four is less than and equal to the number 6 (wrong) OR the string “grass” is not equal to the string “green” (correct)
  AND
  the number twelve times two = 144 (incorrect) AND true (is neither correct or incorrect, but is is true!)
  aka (false || true) && !(false && true)
  when using OR aka ||, if either one is true, then the result is true, therefore (false || true) == true
  when using AND aka &&, both have to be true to equal true, therefore (false && true) == false
  (true) && !(false)
  !(false) = true
  (true) && (true)
  And as previously stated, you need both to answer true when using && to be true so our final answer is TRUE!
  and that is how I think a computer would process this example, but it needs 1/100000th of a second to process that whole thought…
• 2.2 – Use the techniques shown so far to write a program that calculates and shows the value of 210 (2 to the 10th power).

  var counter = 2;
  // because 2*2 is done right off the bat
  var our_number = 2;
  while (counter <= 10){
  our_number = our_number * 2;
  counter++;
  alert(our_number);
  }
  

  see it in action here

• 2.3 - With some slight modifications, the solution to the previous exercise can be made to draw a triangle. And when I say 'draw a triangle' I mean 'print out some text that almost looks like a triangle when you squint'.

  var counter = 1;
  var triangles_son = "#";
  while (counter <= 10){
  document.write(triangles_son + "");
  counter++;
  triangles_son = triangles_son + "#";
  }
  

  see it in action here

• 2.4 - Rewrite the solutions of the previous two exercises to use for instead of while.

  var our_number = 2;
  for (var counter = 2; counter <= 10; counter++){
  our_number = our_number * 2;
  alert(our_number);
  }
  

  see it in action here

  var triangles_son = "#";
  for (counter = 1; counter <= 10; counter++) {
  document.write(triangles_son + "");
  triangles_son = triangles_son + "#";
  }
  

  see it in action here

• 2.5 - Write a program to ask yourself, using prompt, what the value of 2 + 2 is. If the answer is "4", use alert to say something praising. If it is "3" or "5", say "Almost!". In other cases, say something mean.

  var nerd_wisdom = prompt("Yo math professor! What does 2 + 2 equal?", "");
  if (nerd_wisdom == "4"){
  alert("Holy crap, you're as smart as my 6 year old nephew!");
  } else if (nerd_wisdom == "3" || nerd_wisdom == "5"){
  alert("Almost! And by almost, I mean 'really?'");
  } else {
  alert("Come on bro, really? I mean really? My cat knows the answer to this.");
  }
  

  see it in action here

• 2.6 - Add a while and optionally a break to your solution for the previous exercise, so that it keeps repeating the question until a correct answer is given.
  Note that while (true) ... can be used to create a loop that does not end on its own account. This is a bit silly, you ask the program to loop as long as true is true, but it is a useful trick.

  var nerd_wisdom;
  while(true){
  	nerd_wisdom = prompt("Yo math professor! What does 2 + 2 equal?", "");
  	if (nerd_wisdom == "4"){
  	alert("Holy crap, you're as smart as my 6 year old nephew!");
  	break;
  	} else if (nerd_wisdom == "3" || nerd_wisdom == "5"){
  	alert("Almost! And by almost, I mean 'really?'");
  	} else {
  	alert("Come on bro, really? I mean really? My cat knows the answer to this.");
  	}
  }
  

  see it in action here

• Create an example that shows a valid use of the 'guard' and 'default' operators in Javascript.

  var jason_lydon = awesome && awesome.too_the_extreme;

#p2pu-Jan2011-javascript101