eg-259:lecture6
Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
eg-259:lecture6 [2013/02/06 22:47] – [Array Length] eechris | eg-259:lecture6 [2013/02/07 21:09] (current) – [Exercises] eechris | ||
---|---|---|---|
Line 420: | Line 420: | ||
myList.length = 150; | myList.length = 150; | ||
</ | </ | ||
- | * Example [[http:// | + | * Example [[http:// |
---- | ---- | ||
Line 483: | Line 483: | ||
* Coerce elements to strings, if necessary, and concatenate them together, separated by commas (exactly like join(", | * Coerce elements to strings, if necessary, and concatenate them together, separated by commas (exactly like join(", | ||
* '' | * '' | ||
- | * Example: [[/eg-259/examples/lecture6/nested_arrays.html|nested_arrays.html]] | + | * Example: [[http://jsfiddle.net/cpjobling/ |
---- | ---- | ||
<code javascript> | <code javascript> | ||
- | < | + | // nested_arrays.html An example |
- | < | + | // array of arrays |
- | An example illustrate an array of arrays | + | |
- | --> | + | |
- | <html lang=" | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | </ | + | |
- | < | + | |
- | <script type = " | + | |
- | // Create an array object with three arrays | + | |
- | | + | var element |
- | | + | // Create an array object with three arrays as its |
- | | + | // elements |
- | document.write(" | + | |
- | for(var col = 0; col <= 2; col++) { | + | var nested_array |
- | | + | [2, 4, 6], |
- | } | + | |
- | document.write("< | + | |
- | } | + | ]; |
- | | + | |
- | </ | + | |
- | </ | + | |
- | </code> | + | // Display the elements of nested_list |
+ | result_text = "<p>"; | ||
+ | for (var row = 0; row <= 2; row++) { | ||
+ | result_text += "Row " + row + ": | ||
+ | for (var col = 0; col <= 2; col++) { | ||
+ | result_text += nested_array[row][col] + " "; | ||
+ | } | ||
+ | result_text += "< | ||
+ | } | ||
+ | element.append(result_text + "</ | ||
+ | </ | ||
===== Learning Outcomes — Functions ===== | ===== Learning Outcomes — Functions ===== | ||
Line 548: | Line 544: | ||
* If '' | * If '' | ||
<code javascript> | <code javascript> | ||
- | | + | ref_fun = fun; |
- | . . . | + | // . . . |
- | ref_fun(); | + | ref_fun(); |
</ | </ | ||
- | |||
===== Defining Functions ===== | ===== Defining Functions ===== | ||
Line 566: | Line 561: | ||
* There is no type checking of parameters, nor is the number of parameters checked (excess actual parameters are ignored, excess formal parameters are set to '' | * There is no type checking of parameters, nor is the number of parameters checked (excess actual parameters are ignored, excess formal parameters are set to '' | ||
* All parameters are sent through a property array, '' | * All parameters are sent through a property array, '' | ||
- | * Example: [[/eg-259/examples/lecture6/parameters.html|parameters.html]] | + | * Example: [[http://jsfiddle.net/cpjobling/ |
---- | ---- | ||
<code javascript> | <code javascript> | ||
- | < | + | // parameters.html The params function and a test |
- | < | + | // driver for it. This example illustrates |
- | The params function and a test driver for it. | + | // function |
- | This example illustrates | + | |
- | --> | + | |
- | <html lang=" | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | < | + | |
- | // Function params | + | |
- | // Parameters: two named parameters | + | |
- | // | + | |
- | // Returns: nothing | + | |
- | function params(a, b) { | + | var element = $('# |
- | document.write(" | + | |
- | document.write(" | + | |
- | for(var arg = 0; arg < arguments.length; | + | // Function describe_params |
- | document.write(arguments[arg], | + | // Parameters: two named parameters and one unnamed |
- | } | + | // |
- | document.write("< | + | // Returns: nothing |
- | } | + | |
- | </script> | + | |
- | </head> | + | |
- | < | + | |
- | < | + | |
- | // A text driver for params | + | |
- | params(" | + | function describe_params(a, b) { |
- | | + | var text = "Function < |
- | | + | "Parameter values are: <br />"; |
- | </script> | + | |
- | </body> | + | text += arguments[arg] + "<br />"; |
- | </html> | + | } |
- | </code> | + | text += "In addition named-parameter <em>a</em> was " + a + |
+ | " | ||
+ | return text; | ||
+ | } | ||
+ | // A text driver for params | ||
+ | |||
+ | element.append("< | ||
+ | element.append("< | ||
+ | element.append("< | ||
+ | </ | ||
===== Passing a Function: Sorting ===== | ===== Passing a Function: Sorting ===== | ||
Line 637: | Line 622: | ||
* It is given a name by assigning it to a variable -- in this case '' | * It is given a name by assigning it to a variable -- in this case '' | ||
* This makes explicit the fact that a function is just another primitive in JavaScript. | * This makes explicit the fact that a function is just another primitive in JavaScript. | ||
- | * You'll see this form used a lot in [[http://codeyear.com|CodeYear]] and in event handlers to come later. | + | * You'll see this form used a lot in the [[http://www.codecademy.com/ |
===== Another Example ===== | ===== Another Example ===== | ||
- | * [[/eg-259/examples/lecture6/medians.html|medians.html]] | + | * [[http://jsfiddle.net/cpjobling/ |
---- | ---- | ||
Line 654: | Line 638: | ||
<code javascript> | <code javascript> | ||
- | < | + | // medians.js |
- | < | + | // A function and a function tester |
- | A function and a function tester | + | // Illustrates array operations |
- | Illustrates array operations | + | |
- | --> | + | |
- | <html lang=" | + | |
- | < | + | |
- | <meta charset=" | + | |
- | < | + | |
- | < | + | |
- | /* Function median | + | |
- | | + | |
- | | + | |
- | | + | |
- | | + | |
- | */ | + | |
- | var median = function (list) { | ||
- | list.sort(function(a, | ||
- | return a - b; | ||
- | }); | ||
- | var list_len = list.length; | ||
- | // Use the modulus operator to determine whether | + | var element = $('# |
- | // the array's length is odd or even | + | |
- | // Use Math.floor to truncate numbers | + | |
- | // Use Math.round to round numbers | + | |
- | if((list_len % 2) == 1) { | + | /* |
- | return list[Math.floor(list_len | + | Function median |
- | } | + | Parameter: An array of numbers |
- | else { | + | Return value: The median of the array |
- | return Math.round((list[list_len / 2 - 1] + list[list_len / 2]) / 2); | + | */ |
- | } | + | |
- | }; // end of function median note semicolon | + | |
- | </ | + | |
- | </ | + | |
- | < | + | |
- | < | + | |
- | var my_list_1 = [8, 3, 9, 1, 4, 7]; | + | |
- | var my_list_2 = [10, -2, 0, 5, 3, 1, 7]; | + | |
- | var med = median(my_list_1); | + | |
- | document.write(" | + | |
- | med = median(my_list_2); | + | |
- | document.write(" | + | |
- | </ | + | |
- | </ | + | |
- | </ | + | |
- | </code> | + | |
+ | var median = function (list) { | ||
+ | list.sort(function (a, b) { | ||
+ | return a - b; | ||
+ | }); | ||
+ | var list_len = list.length; | ||
+ | |||
+ | // Use the modulus operator to determine whether | ||
+ | // the array' | ||
+ | // Use Math.floor to truncate numbers | ||
+ | // Use Math.round to round numbers | ||
+ | |||
+ | if ((list_len % 2) == 1) { | ||
+ | return list[Math.floor(list_len / 2)]; | ||
+ | } else { | ||
+ | return Math.round((list[list_len / 2 - 1] + list[list_len / 2]) / 2); | ||
+ | } | ||
+ | }; // end of function median -- note semicolon | ||
+ | |||
+ | var my_list_1 = [8, 3, 9, 1, 4, 7], | ||
+ | my_list_2 = [10, -2, 0, 5, 3, 1, 7], | ||
+ | med; | ||
+ | |||
+ | med = median(my_list_1); | ||
+ | element.append("< | ||
+ | |||
+ | med = median(my_list_2); | ||
+ | element.append("< | ||
+ | </ | ||
Line 718: | Line 693: | ||
myPlane = new Plane(" | myPlane = new Plane(" | ||
</ | </ | ||
+ | |||
+ | [[http:// | ||
---- | ---- | ||
Note by convention, constructors use upper case names to distinguish them from ordinary functions. Think //proper noun//. | Note by convention, constructors use upper case names to distinguish them from ordinary functions. Think //proper noun//. | ||
- | |||
===== Method Properties ===== | ===== Method Properties ===== | ||
Line 797: | Line 773: | ||
===== Exercises ===== | ===== Exercises ===== | ||
- | Write, test and debug (if necessary) | + | Use jsFiddle or some other method to write, test and debug (if necessary) |
- //Output//: A table of numbers from 5 to 15 and their squares and cubes, using alert. | - //Output//: A table of numbers from 5 to 15 and their squares and cubes, using alert. | ||
- | - //Output//: The first 20 Fibonacci numbers, which are defined as in the following sequence 1, 1, 2, 3, … where each number in the sequence is the sum of the two previous numbers. Use '' | + | - //Output//: The first 20 Fibonacci numbers, which are defined as in the following sequence 1, 1, 2, 3, … where each number in the sequence is the sum of the two previous numbers. Use '' |
- Modify the script of Exercise 2 to input a number, //n//, using '' | - Modify the script of Exercise 2 to input a number, //n//, using '' | ||
- // | - // |
eg-259/lecture6.1360190848.txt.gz · Last modified: 2013/02/06 22:47 by eechris