-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmodule-1-programming-assignment.html
432 lines (303 loc) · 11.5 KB
/
module-1-programming-assignment.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CMPS 260: Module 1 Programming Assignment</title>
<style>* { font-family: monospace; }</style>
<script>
// NOTE: You can enter both code and explanations. For an explanation, start
// the line with '//' which indicates a comment.
// NOTE: console.log prints text to the browser console that you can enable
// to see the output. It is a little bit more convenient than alert so
// we will use it most of the time.
// NOTE: Please review the following links regularly:
// https://it.pointpark.edu/tutorials/arrays-vs-objects/
// https://it.pointpark.edu/tutorials/no-prototype-vs-prototype/
// https://it.pointpark.edu/tutorials/implementation-vs-interface/
//----------------------------//
// Setting up the environment //
//----------------------------//
console.log("Setting up the environment");
// 1. Open this file in the browser.
// 2. Make sure to enable the developer tools.
// 3. Install Atom.
// 4. Change the content of the HTML body element from TODO to See Console!
// 5. Reload the file in the browser.
// 6. Copy this file and index.html to a new directory in your jail.
// 7. Homework submissions will include a link to a file in your jail.
// 8. Submit this file when you are done.
// Relevant tutorials and videos:
// https://it.pointpark.edu/tutorials/atom-editor/
// https://it.pointpark.edu/tutorials/creating-your-homepage/
// https://it.pointpark.edu/tutorials/filezilla/
//-------------------//
// JavaScript basics //
//-------------------//
console.log("JavaScript basics");
// 1. Search the web to find the difference between static and dynamic typing.
// 2. Define a variable and initialized it to the string Hello World!
// 3. Print the content of the variable to the console (use console.log()).
// 4. Alert the content of the variable to the screen.
var newVariable = "Hello World!";
console.log(newVariable);
alert("The contents of newVariable are: " + newVariable);
// 5. Predict what the following code will print (write it down), then try it.
//I predict both functions will return "local" as they are defined within the function
var myVariable = "global";
var myOtherVariable = "global";
function myFunction() {
var myVariable = "local";
return myVariable;
}
function myOtherFunction() {
myOtherVariable = "local";
return myOtherVariable;
}
console.log(myVariable);
console.log(myFunction());
console.log(myOtherVariable);
console.log(myOtherFunction());
console.log(myOtherVariable);
// 6. Figure out what the & operator does.
// E.g., 10 & 5 == 0 and 10 & 6 == 2, why?
// NOTE: this is a difficult question
// HINT: use the console in the browser for testing
//Answer: The & operator works on the bits of the character.
// 9 & 10 = 8
console.log(9 & 10);
// 7. What is the difference between == and ===? Give an example.
console.log("== is not strict whereas === is strict when comparing data types. ");
//console.log("Integer '1' == character '1' but integer '1' !=== character '1'
//because they are of different data types, integer and character");
//--------------------//
// Control structures //
//--------------------//
console.log("Control structures");
// 1. Write an if statement to check if a year is a leap year and print it to
// the console.
var year = 2016;
if (year % 4 && year % 400) {
console.log("True");
} else {
console.log("False");
}
// 2. Write a loop to calculate n! (n factorial) and print it to the console.
var n = 5;
var result = 1;
for (i = 1; i < n + 1; i++) {
result = result * i;
}
console.log(result);
//-----------//
// Functions //
//-----------//
console.log("Functions");
// 1. Write a function to check if an array contains a specific number at the
// first or last position of the array.
function checkForNumber(arr, num) {
var lastElement = arr.pop();
var firstElement = arr.shift();
console.log("Last element: " + lastElement);
console.log("First element: " + firstElement);
if (firstElement === num | lastElement === num) {
return true;
} else {
return false;` `
}
}
// NOTE: all these tests should eventually print true.
console.log(checkForNumber([4, 2, 5, 3], 4) === true);
console.log(checkForNumber([4, 2, 5, 3], 3) === true);
console.log(checkForNumber([4, 2, 5, 3], 2) === false);
console.log(checkForNumber([4, 2, 5, 3], 13) === false);
//-------------------------------------------//
// Object-oriented programming in JavaScript //
//-------------------------------------------//
console.log("Object-oriented programming in JavaScript");
// 1. Add methods to the following object to calculate the circumference
// and area.
function Triangle(side) {
this.side = side;
this.getCircumference = function() {
return side * 3;
}
this.getArea = function() {
var s = (side * 3)/2;
var area = Math.sqrt(s * ((s-side)*(s-side)*(s-side)));
return area;
}
}
// ... add getCircumference and getArea methods ...
// HINT: use the prototype
var triangle = new Triangle(5);
console.log("The perimeter of the triangle is " + triangle.getCircumference());
console.log("The area of the triangle is " + triangle.getArea());
//---------------------//
// Debugging and tools //
//---------------------//
console.log("Debugging and tools");
// 1. Always use the developer tools.
// 2. See 1.
Console.log("I am not sure what you are looking for in this debugging section?")
//---------------------------//
// Why should we use arrays? //
//---------------------------//
console.log("Why should we use arrays?");
// 1. Check the weather forecast for the next 5 days and store the expected
// temperature for each day in a separate variable. Calculate the average
// temperature and print it to the console.
var day1 = 88;
var day2 = 81;
var day3 = 84;
var day4 = 90;
var day5 = 86;
var total1 = day1 + day2 + day3 + day4 + day5;
var average1 = total / 5;
console.log("The average fice day forecast is " + average1);
// 2. Solve the same problem as in (1) but store the temperatures in an array.
var fiveDayForecast = [88,81,84,90,86];
var total = 0;
for (var i = 0; i < fiveDayForecast.length; i++) {
total += fiveDayForecast[i];
}
var fiveDayAvg = total / fiveDayForecast.length;
console.log("The average five day forecast is" + fiveDayAvg);
// 3. Suppose you want to look at the forecast for the next 10 days instead of
// 5 days. Is the code for solution (1) or (2) easier to update?
console.log("The second solution is easier to update for a 10 day forecast.");
//----------------------------------//
// Creating and initializing arrays //
//----------------------------------//
console.log("Creating and initializing arrays");
// Use this code to answer the questions below.
var daysOfWeek1 = new Array();
var daysOfWeek2 = new Array(7);
var daysOfWeek3 = new Array("Sunday", "Monday", "Tuesday", "Wednesday",
"Thursday", "Friday", "Saturday");
var daysOfWeek4 = [];
var daysOfWeek5 = ["Sunday", "Monday", "Tuesday", "Wednesday",
"Thursday", "Friday", "Saturday"];
// 1. Get the length for each array and print it to the console.
console.log(daysOfWeek1.length);
console.log(daysOfWeek2.length);
console.log(daysOfWeek3.length);
console.log(daysOfWeek4.length);
console.log(daysOfWeek5.length);
// 2. Is is possible to create an array with just the number 7 in it?
// How about 7 and 8?
var newNumArray = [7];
console.log(newNumArray);
// 3. Which notation do you prefer: new Array() or []?
console.log("I prefer the new Array() notation although I have a habit of using the other notatition.");
// 4. The fibonacci sequence is defined as 0, 1, 1, 2, 3, 5, 8, 13, 21, ...
// Create an array with the first 25 elements of this sequence.
// For more info see https://en.wikipedia.org/wiki/Fibonacci_number
var fibo = [0,1];
var n = 25;
for (var i=2; i<n; i++) {
fibo.push(fibo[i-2] + fibo[i-1]);
}
console.log(fibo);
//-----------------//
// Adding elements //
//-----------------//
console.log("Adding elements");
// Use this array to answer the questions below.
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 1. Add 10 to the end of the array.
arr.push(10);
// 2. Add 0 to the beginning of the array.
arr.unshift(0);
// 3. What is the new length of the array? Guess before checking it.
Console.log("The length of the array is 11. That is my guess.");
Console.log("The actual lenght of the array is" + arr.length);
//-------------------//
// Removing elements //
//-------------------//
console.log("Removing elements");
// Use the array from the 'Adding elements' section.
// 1. Remove 10 from the end of the array.
arr.pop;
// 2. Remove 0 from the beginning of the array.
arr.shift();
//-------------------------------------------------------//
// Adding and removing elements from a specific position //
//-------------------------------------------------------//
console.log("Adding and removing elements from a specific position");
// Use the array from the 'Adding elements' section.
// 1. Remove all elements except the first and last.
var arrItems = arr.splice(1, arr.length - 2);
console.log(arrItems);
// 2. Insert the numbers that were just removed back into the array.
arr.splice(1, 0, arrItems);
console.log(arr);
// NOTE: arr should be back to its original state at this point.
//---------------------------------------------//
// Two-dimensional and multidimensional arrays //
//---------------------------------------------//
console.log("Two-dimensional and multidimensional arrays");
// 1. Sum all the elements in the two-dimensional array below. Print the
// result to the console.
var arr = [[1, 2, 3],
[4, 5, 6],
[7, 8, 9]];
var arraySum = 0;
for (var i = 0; i < arr.length; i++) {
//console.log(arr[i]);
for (var j = 0; j < arr[i].length; j++) {
//console.log(arr[i][j]);
arraySum += arr[i][j];
}
}
console.log("The sum of the multidimensional array is: " + arraySum);
//-----------------------------------------//
// References for JavaScript array methods //
//-----------------------------------------//
console.log("References for JavaScript array methods");
// Use the following two arrays to answer the next questions.
var zero = 0;
var positiveNumbers = [1, 2, 3];
var negativeNumbers = [-3, -2, -1];
// 1. Create a new array 'numbers' that contains all numbers above in order.
function combineTwoArrays(arr1, arr2) {
var numbers = [];
for (var i = 0; i < arr1.length; i++) {
numbers.push(arr1[i]);
}
for (var j = 0; j < arr2.length; j++) {
numbers.push(arr2[j]);
}
return numbers.sort(function(a, b){return a - b});
}
console.log(combineTwoArrays(positiveNumbers, negativeNumbers));
// 2. Check if every number in the numbers array is less than 10 and print
// the result to the console.
for (var i = 0; i < numbers.length; i++) {
if (numbers[i] < 10) {
console.log("The number " + numbers[i] + "is less than 10.")
} else {
console.log("The number " + numbers[i] + "is more than 10.")
}
}
// 3. Select all the nonnegative numbers from the numbers array and store them
// in a new array. Print the array to the console.
var numbers = combineTwoArrays(positiveNumbers, negativeNumbers);
var newNumbers = [];
for (var i = 0; i < numbers.length; i++) {
if (numbers[i] > 0) {
newNumbers.push(numbers[i]);
}
}
console.log("The positive numbers are: " + newNumbers);
// 4. Create a new array that contains all the numbers but then squared.
var numbersSquared = [];
for (var i = 0; i < numbers.length; i++) {
numbersSquared.push(numbers[i] * numbers[i]);
}
console.log(numbersSquared);
</script>
</head>
<body>
See Console
</body>
</html>