Slippery Rock University Dr. Deborah Whitfield Go Browns!



Chapter 9: Abstraction and Libraries

Terms:

parameters
Parameters are named placeholders for values that will be supplied when the function is called. When writing the function, you provide a unique (to this function) identifier that you then use in the function as though it was an actual value. They are very like local or temporary variables, except for the way they get initialized.
arguments
This is like, "For the sake of argument, assume you made $10 per hour." Where, your pay rate in that argument would be $10. (The parameter or placeHolder might be payRate.) You could revisit the argument with a different pay rate, "But, if I make $7.15..." Arguments are the actual values you give to a parameter when you call the function. That is how they get their initial values! In the functions, the actual arguments are shown in bold:
var x = window.prompt("enter value", "1"); // value is text string the user enters
var y = document.getElementById("someID").value; // value is a property of some element
if ( isNaN(x) ) x = 0;  // value is true or false
return
The return statement can be used to get out of a function. It can also be used to send an answer back from a function. A square_root() function wouldn't be much use unless we got an answer. On a clculator, the answer is just displayed. In JS we can use it in any expression. All three of the example functions above return a value that is then being used somehow. Example:
function convertC2F (tempInC) {
   return 9/5*tempInC + 32;
}
The parameter tempInC is supplied a value when the funtion is called. That value replaces all of the placeholders (parameters) in the function. The caluculation is performed and the resulting value is returned to replace the function call itself:
var someTemp = 0;
var freezingPt = convertC2F(someTemp);
var boilPt = convertC2F(100);
scope
Scope refers to where a variable is visible, that is, from which parts of the code it can be accessed. The scope of a variable inside a compound statement (including a function) is limited to that compound statement.
life
When a variable is created and when it is destroyed. When created, it is given its initial value, although JS allows you to skip initialization. If you skip initialization, JS just gives a special null value.
global variables
Global variables, or just globals, are declared outside of any function. They may then be accessed by any function.

In the English Kitchen lab we used four functions. All read a value from the user that is entered into a form text field using document.getElementById"someID").value. This value is, by definition, text.

Each of the functions changed the value to a float and rounded it to one decimal place. An example is:

  kgs=parseFloat(document.getElementById('kgs').value);
  lbs = kgs*2.2;
  lbs=Math.round(lbs*10);
  lbs=lbs/10;

But the repetetiveness should make you think of a function. Imagine a function that did this task for you:

// returns 0 or the float equivalent of userValue
function rndToOnePlace(userValue){
   //userValue is my placeholder for whatever is being checked
  myAnswer = Math.round(userValue * 10);
  myAnswer = myAnswer / 10;
  return myAnswer;
}

Then, this function could be used by modifying the code above to:

  kgs=parseFloat(document.getElementById('kgs').value);
  lbs = kgs*2.2;
  lbs = rndToOnePlace(lbs);
OR
  kgs=parseFloat(document.getElementById('kgs').value);
  lbs = rndToOnePlace(kgs * 2.2);

Naturally, we would re-use this code for each row in the table!


  • Parameters & Arguments

  • Examples — look for the way functions provide a shortcut for making repetitive or long tasks happen neatly

  • Try It Exercises

    1. Modify the Metric Conversions code
      1. Modify the code so that each function accepts a parameter: the value from the text box
      2. use onChange() instead of a convert button
      3. Use only one function named weightConversion
        • add a second paramter that is the multiplier and multply the answer by the multiplier
        • Update the HTML to call weightCOnversion
        • Remove the old functions
    2. Try this lab

    Scope and Life

    Most students find scope to be confusing. Imagine a set of doors (variables) accessible only from a foyer. That is the scope of the doors. They cannot be accessed directly from the hallway or other parts of the building, only from within the foyer. They exist and we know they are there, but we can't get to them without entering the foyer.

    Life is a closely related topic. It refers to when a variable is created and given its initial value. And, where (or when) it goes away. For most of our variables, they are the same. The variable is created when JS begins interpreting a compound statement (or function) and goes away when we leave it. In the analogy above, the doors are (magically) created when we enter the foyer. We know they will exist as soon as we step into the foyer. (And you thought The Matrix was all fantasy.)


    Global Variables

    Global variables are quite different in that you can access them from anywhere (as long as you haven't created a local variable with the same name).

    Each time a function starts, it's local variable (those declared inside of it) are re-initialized. They go away when the function ends and start next time with no memory of previous values. That's why they are also sometimes called temporary variables.

    Global variables are declared outside of the scope of any function. They are created when the <script> is processed and stay around unless the page is re-loaded. That is, they remember values between function calls. They are independent of the function.

    Constants are often declared as globals.

    Study this example